Bootstrap Input Textbox Code Example


Example 1: input with bootstrap

<form>   <div class="form-group">     <label for="exampleInputEmail1">Email address</label>     <input type="email" class="form-control">     <small id="emailHelp" class="form-text text-muted">Hello, World</small>   </div>  </form>

Example 2: bootstrap input tagsinput

<select multiple data-role="tagsinput">   <option value="Amsterdam">Amsterdam</option>   <option value="Washington">Washington</option>   <option value="Sydney">Sydney</option>   <option value="Beijing">Beijing</option>   <option value="Cairo">Cairo</option> </select>

Example 3: bootsrap textbox

<form>   <div class="form-group">     <label for="exampleFormControlInput1">Email address</label>     <input type="email" class="form-control" id="exampleFormControlInput1" placeholder="name@example.com">   </div>   <div class="form-group">     <label for="exampleFormControlSelect1">Example select</label>     <select class="form-control" id="exampleFormControlSelect1">       <option>1</option>       <option>2</option>       <option>3</option>       <option>4</option>       <option>5</option>     </select>   </div>   <div class="form-group">     <label for="exampleFormControlSelect2">Example multiple select</label>     <select multiple class="form-control" id="exampleFormControlSelect2">       <option>1</option>       <option>2</option>       <option>3</option>       <option>4</option>       <option>5</option>     </select>   </div>   <div class="form-group">     <label for="exampleFormControlTextarea1">Example textarea</label>     <textarea class="form-control" id="exampleFormControlTextarea1" rows="3"></textarea>   </div> </form>

Example 4: bootstrap input

<div class="input-group mb-3">   <div class="input-group-prepend">     <span class="input-group-text" id="basic-addon1">@</span>   </div>   <input type="text" class="form-control" placeholder="Username" aria-label="Username" aria-describedby="basic-addon1"> </div>  <div class="input-group mb-3">   <input type="text" class="form-control" placeholder="Recipient's username" aria-label="Recipient's username" aria-describedby="basic-addon2">   <div class="input-group-append">     <span class="input-group-text" id="basic-addon2">@example.com</span>   </div> </div>  <label for="basic-url">Your vanity URL</label> <div class="input-group mb-3">   <div class="input-group-prepend">     <span class="input-group-text" id="basic-addon3">https://example.com/users/</span>   </div>   <input type="text" class="form-control" id="basic-url" aria-describedby="basic-addon3"> </div>  <div class="input-group mb-3">   <div class="input-group-prepend">     <span class="input-group-text">$</span>   </div>   <input type="text" class="form-control" aria-label="Amount (to the nearest dollar)">   <div class="input-group-append">     <span class="input-group-text">.00</span>   </div> </div>  <div class="input-group">   <div class="input-group-prepend">     <span class="input-group-text">With textarea</span>   </div>   <textarea class="form-control" aria-label="With textarea"></textarea> </div>

Comments

Popular posts from this blog

Converting A String To Int In Groovy

"Cannot Create Cache Directory /home//.composer/cache/repo/https---packagist.org/, Or Directory Is Not Writable. Proceeding Without Cache"

Android How Can I Convert A String To A Editable