×

Welcome to TagMyCode

Please login or create account to add a snippet.
 

Bootstrap Form Boilerplate

0
0
 
0
Language: HTML
Posted by: Justin Gross
Added: Jun 16, 2014 12:13 PM
Views: 2064
Tags: angular boilerplate bootstrap html
  1. <html lang="en">
  2.   <head>
  3.     <meta charset="utf-8">
  4.     <meta http-equiv="X-UA-Compatible" content="IE=edge">
  5.     <meta name="viewport" content="width=device-width, initial-scale=1">
  6.     <title>Bootstrap 101 Template</title>
  7.     <!-- Bootstrap -->
  8.     <link href="css/bootstrap.min.css" rel="stylesheet">
  9.     <!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
  10.     <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
  11.     <!--[if lt IE 9]>
  12.      <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
  13.      <script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
  14.    <![endif]-->
  15.    
  16.   </head>
  17.   <body>
  18.     <h1>
  19.       Welcome to Survey!
  20.     </h1>
  21.     <form class="form-horizontal">
  22.       <div class="form-group">
  23.         <label for="name" class="col-sm-2 control-label">
  24.         Name</label>
  25.  
  26.         <div class="col-sm-6">
  27.           <input placeholder="Enter Name..." type="text" class="form-control">
  28.          
  29.         </div>
  30.       </div>
  31.       <div class="form-group">
  32.         <label for="email" class="col-sm-2 control-label">
  33.         Email</label>
  34.  
  35.         <div class="col-sm-6">
  36.           <input placeholder="Enter Email..." type="email" class="form-control">
  37.          
  38.         </div>
  39.       </div>
  40.       <div class="form-group">
  41.         <label for="message" class="col-sm-2 control-label">
  42.         Comment</label>
  43.  
  44.         <div class="col-sm-6">
  45.           <textarea placeholder="Enter Comments..." class="form-control">
  46.           </textarea>
  47.          
  48.         </div>
  49.       </div>
  50.       <div class="form-group">
  51.         <label for="website" class="col-sm-2 control-label">
  52.         Development Languages...</label>
  53.  
  54.         <div class="col-sm-6">
  55.           <label class="checkbox-inline">
  56.           <input type="checkbox" value="option1">
  57.           HTML </label> <label class="checkbox-inline"> <input type="checkbox" value="option2">
  58.           Javascript </label> <label class="checkbox-inline"> <input type="checkbox" value="option3">
  59.           CSS </label>
  60.         </div>
  61.       </div>
  62.       <div class="form-group">
  63.         <label for="how-hear" class="col-sm-2 control-label">
  64.         How did you hear...</label>
  65.  
  66.         <div class="col-sm-6">
  67.           <label class="radio-inline">
  68.           <input name="howHear" type="radio" value="option1">
  69.           Retail </label> <label class="radio-inline"> <input name="howHear" type="radio" value="option2">
  70.           Phone Call </label> <label class="radio-inline"> <input name="howHear" type="radio" value="option3">
  71.           Website </label>
  72.         </div>
  73.       </div>
  74.       <div class="form-group">
  75.         <label for="city" class="col-sm-2 control-label">
  76.         City</label>
  77.  
  78.         <div class="col-sm-6">
  79.           <select class="form-control">
  80.             <option>Seattle
  81.             <option>Redmond
  82.             <option>Lakewood
  83.             <option>Alderton
  84.           </select>
  85.          
  86.         </div>
  87.       </div>
  88.     </form>
  89.     <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
  90.     <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js">
  91.     <!---->
  92.     </script>
  93.     <!-- Include all compiled plugins (below), or include individual files as needed -->
  94.     <script src="js/angular.min.js">
  95.     <!---->
  96.     </script>
  97.     <script src="js/bootstrap.min.js">
  98.     <!---->
  99.     </script>
  100.   </body>
  101. </html>
  102.  

Write a comment

To post comments, please log in or register.