Teach with us

Bootstrap Form Input

The most common form text field is the input field. This is where users will enter most of the essential form data. Bootstrap offers support for all native HTML5 input types: text, password, datetime,datetime-local, date, month, time, week, number, email, url, search, tel, and color. The proper type declaration is required to make Inputs fully styled.

 You can try to run the following code to learn how to work with form input in Bootstrap

Example

Live Demo

<!DOCTYPE html>
<html>
   <head>
      <title>Bootstrap Form Input</title>
      <meta name = "viewport" content="width = device-width, initial-scale = 1">
      <link rel = "stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css">
      <script src = "https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
      <script src = "https://stackpath.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js"></script>
   </head>
   <body>
      <form role = "form">
         <div class = "form-group">
            <label for = "name">Player</label>
            <input type = "text" class = "form-control" placeholder = "Player Name">
         </div>
         <div class = "form-group">
            <label for = "name">Rank</label>
            <input type = "text" class = "form-control" placeholder = "Player Rank">
         </div>
      </form>
   </body>
</html>
Lakshmi Srinivas
Lakshmi Srinivas

Programmer / Analyst / Technician

Updated on 12-Jun-2020 13:38:13

0 Views

Tutorials Point

Previous Page Next Page  
Advertisements