zoukankan      html  css  js  c++  java
  • bootstrap

    表单控件大小

    您可以分别使用 class .input-lg 和 .col-lg-* 来设置表单的高度和宽度。下面的实例演示了这点:

    <form role="form">
      <div class="form-group">
        <input class="form-control input-lg" type="text" placeholder=".input-lg">
      </div>
      <div class="form-group">
        <input class="form-control" type="text" placeholder="默认输入">
      </div>
      <div class="form-group">
        <input class="form-control input-sm" type="text" placeholder=".input-sm">
      </div>
      <div class="form-group"></div>
      <div class="form-group">
        <select class="form-control input-lg">
          <option value="">.input-lg</option>
        </select>
      </div>
      <div class="form-group">
        <select class="form-control">
          <option value="">默认选择</option>
        </select>
      </div>
      <div class="form-group">
        <select class="form-control input-sm">
          <option value="">.input-sm</option>
        </select>
      </div>
      <div class="row">
        <div class="col-lg-2">
          <input type="text" class="form-control" placeholder=".col-lg-2">
        </div>
        <div class="col-lg-3">
          <input type="text" class="form-control" placeholder=".col-lg-3">
        </div>
        <div class="col-lg-4">
          <input type="text" class="form-control" placeholder=".col-lg-4">
        </div>
      </div>
    </form>
    

      表单帮助文本

    Bootstrap 表单控件可以在输入框 input 上有一个块级帮助文本。为了添加一个占用整个宽度的内容块,请在 <input> 后使用 .help-block。下面的实例演示了这点:

    <form role="form">
      <span>帮助文本实例</span>
      <input class="form-control" type="text" placeholder="">
      <span class="help-block">一个较长的帮助文本块,超过一行,
      需要扩展到下一行。本实例中的帮助文本总共有两行。</span>
    </form>
    

      

  • 相关阅读:
    ios7 苹果原生二维码扫描(和微信类似)
    ios7之后 根据UILabel的文字计算frame的方法
    [Luogu1944] 最长括号匹配
    [bzoj3916] friends
    [NOIp2006] 能量项链
    [NOIp2003] 加分二叉树
    [Luogu1353] 跑步Running
    [Luogu2214] Mooo Moo S
    [POJ2452] Sticks Problem
    [POJ2406] Power Strings
  • 原文地址:https://www.cnblogs.com/yongyuandishen/p/14152347.html
Copyright © 2011-2022 走看看