转载

Bootstrap 辅助文本

辅助文本

针对表单控件的“块(block)”级辅助文本。

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

A block of help text that breaks onto a new line and may extend beyond one line.
 <span class="help-block">A block of help text that breaks onto a new line and may extend beyond one line.</span> 

实例2演示:

  1. <!DOCTYPE html> 
  2. <html> 
  3. <head> 
  4.    <title>Bootstrap 实例 - 表单帮助文本</title> 
  5.    <link href="/bootstrap/css/bootstrap.min.css" rel="stylesheet"> 
  6.    <script src="/scripts/jquery.min.js"></script> 
  7.    <script src="/bootstrap/js/bootstrap.min.js"></script> 
  8. </head> 
  9. <body> 
  10.  
  11. <form role="form"> 
  12.    <span>帮助文本实例</span> 
  13.    <input class="form-control" type="text" placeholder=""> 
  14.    <span class="help-block">一个较长的帮助文本块,超过一行需要扩展到下一行。本实例中的帮助文本总共有两行!一个较长的帮助文本块,超过一行需要扩展到下一行。本实例中的帮助文本总共有两行</span> 
  15. </form> 
  16.  
  17. </body> 
  18. </html> 

运行结果:

帮助文本实例 一个较长的帮助文本块,超过一行, 需要扩展到下一行。本实例中的帮助文本总共有两行!一个较长的帮助文本块,超过一行, 需要扩展到下一行。本实例中的帮助文本总共有两行。
正文到此结束
Loading...