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

实例:

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>Bootstrap历练实例:表单帮助文本</title>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width,initial-scale=1.0" />
<link rel="stylesheet" href="bootstrap-3.3.5-dist/css/bootstrap.min.css" />
</head>
<body>
<div class="container">
<form class="form-horizontal" role="form">
<div class="form-group">
<span>表单帮助文本</span>
<input type="text" class="form-control" placeholder="表单帮助文本" />
<span class="help-block">Bootstrap表单控件可以在输入框input上有一个块级帮助文本,
为了添加一个占用整个宽度的内容块,请在input后添加help-block.</span>
</div>
</form>
</div>
<script src="jQuery/jquery-2.1.4.js"></script>
<script src="bootstrap-3.3.5-dist/js/bootstrap.min.js"></script>
</body>
</html>

Bootstrap历练实例:表单帮助文件的更多相关文章

  1. Bootstrap历练实例:响应式导航(带有表单)

    <!DOCTYPE html><html><head><meta http-equiv="Content-Type" content=&q ...

  2. Bootstrap历练实例:导航中的表单

    Bootstrap历练实例:导航中的表单,它是使用class.navbar-form类,这确保了表单适当的垂直对齐和在较窄的视口中折叠的行为,使用这个对齐方式选项来决定导航栏中的内容放置在哪里. 实例 ...

  3. Bootstrap历练实例:表单控件大小

    表单控件大小 您可以分别使用 class .input-lg 和 .col-lg-* 来设置表单的高度和宽度. 实例: <!DOCTYPE html><html><hea ...

  4. Bootstrap历练实例:表单控件状态(禁用的字段集fieldset)

    禁用的字段集 fieldset 对 <fieldset> 添加 disabled 属性来禁用 <fieldset> 内的所有控件. <!DOCTYPE html>& ...

  5. Bootstrap历练实例:表单控件状态(禁用)

    禁用的输入框 input 如果您想要禁用一个输入框 input,只需要简单地添加 disabled 属性,这不仅会禁用输入框,还会改变输入框的样式以及当鼠标的指针悬停在元素上时鼠标指针的样式. < ...

  6. Bootstrap历练实例:表单控件状态(焦点)

    输入框焦点 当输入框 input 接收到 :focus 时,输入框的轮廓会被移除,同时应用 box-shadow. <!DOCTYPE html><html><head& ...

  7. Bootstrap<基础六> 表单

    Bootstrap 通过一些简单的 HTML 标签和扩展的类即可创建出不同样式的表单. 表单布局 Bootstrap 提供了下列类型的表单布局: 垂直表单(默认) 内联表单 水平表单 垂直或基本表单 ...

  8. js实现无刷新表单提交文件,将ajax请求转换为form请求方法

    最近在做项目的时候遇到一个需要上传文件的需求,因为ajax请求是无法上传二进制文件流的,所以只能用form表单提交,而form提交有一个问题就是会使页面刷新,本文解决了form表单提交文件时页面刷新的 ...

  9. Bootstrap 历练实例-轮播(carousel)插件的事件

    事件 下表列出了轮播(Carousel)插件中要用到的事件.这些事件可在函数中当钩子使用. 事件 描述 实例 slide.bs.carousel 当调用 slide 实例方法时立即触发该事件. $(' ...

随机推荐

  1. 668. Kth Smallest Number in Multiplication Table

    Nearly every one have used the Multiplication Table. But could you find out the k-th smallest number ...

  2. [Xcode 实际操作]一、博主领进门-(15)读取当前应用的信息

    目录:[Swift]Xcode实际操作 本文将演示读取当前应用的配置信息. 在项目导航区,打开视图控制器的代码文件[ViewController.swift] import UIKit class V ...

  3. iOS app支付宝接口调用的一点总结(补充支付宝SDK&Demo下载地址)

    由于app内需要用到支付功能,选择了当前最流行的支付宝进行支付.在进行内嵌支付宝功能开发时,被它狠狠的耍了一把. 根据支付宝开发文档,参考demo代码.将相关支付功能加到了自己的代码中.一些根据文档来 ...

  4. 48个国际音标-/iː/

    /iː/ 是单元音前元音,是个长元音. ***ee,ea,ie,ei*** 1)张开你的嘴巴,好像你在微笑,露出你的牙齿,嘴唇向两边伸开,成扁平形. 2)将舌前部向硬腭尽量抬起.舌头轻微接触下齿背部. ...

  5. PAT甲级——1134 Vertex Cover (25 分)

    1134 Vertex Cover (考察散列查找,比较水~) 我先在CSDN上发布的该文章,排版稍好https://blog.csdn.net/weixin_44385565/article/det ...

  6. [hdu1686] Oulipo【KMP】

    传送门:http://acm.hdu.edu.cn/showproblem.php?pid=1686 保存KMP模版,代码里P是模版串,next[]就是为它建立的.T是文本串,就是一般比较长的.nex ...

  7. 12.Maps

    1       Maps 1.1  Map声明和访问 maps中的元素是key-value对儿,key与value之间使用冒号(:)分割.创建一个空value的map,使用[:].默认情况下,map的 ...

  8. CSS入门使用

    声明标签 HTML <!DOCTYPE> 内链样式表 <body style="background-color:green;margin:0;padding:0;&quo ...

  9. JMeter--PerfMon Metrics Collector监控内存及CPU

    1.需要准备的软件及插件 ServerAgent-2.2.1.zip JMeterPlugins-Standard-1.3.1.zip 2.jmeter上JMeterPlugins-Standard- ...

  10. C/C++程序员应聘常见面试题深入剖析(2)

    摘自:http://blog.csdn.net/zhoudengqing 3.内功题 试题1:分别给出BOOL,int,float,指针变量 与“零值”比较的 if 语句(假设变量名为var) 解答: ...