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> 

运行结果:

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

没有找到答案?搜索一下吧!

学习导航


Bootstrap3中文开发手册参考网站
w3c.3306.biz 提供的内容仅用于学习或测试。所有内容均整理自互联网!目的是为了让更多读者欣赏,我们不保证内容的正确性,并对任何法律问题及风险不承担任何责任。 当您在浏览本站时,代表您已接受了本站的使用条款和隐私条款。(删除内容:512876994#qq.com)