当您需要在一个水平表单内表单标签后放置纯文本时，请在 <p> 上使用 class .form-control-static。

实例：

<!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 role="form" class="form-horizontal">
<div class="form-group">
<label for="email" class="control-label col-sm-2">Email:</label>
<div class="col-sm-10">
<p class="form-control-static">53209322@qq.com</p>
</div>
</div>

<div class="form-group">
<label for="password" class="control-label col-sm-2">密码：</label>
<div class="col-sm-10">
<input type="password" id="password" class="form-control" placeholder="Input you password" />
</div>
</div>
</form>
</div>

<script src="Css/jquery-2.1.4.js"></script>
<script src="bootstrap-3.3.5-dist/js/bootstrap.min.js"></script>
</body>
</html>

Bootstrap 静态控件的更多相关文章

  1. 吴裕雄 Bootstrap 前端框架开发——Bootstrap 表单：静态控件

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

  2. bootstrap学习笔记--bootstrap组件

    前面已经学习了bootstrap环境搭建以及基本布局方面的知识,下面将学习下关于bootstrap的相关组件,知识点有点多. 关于bootstrap组件知识点目录: Bootstrap--代码显示 B ...

  3. Bootstrap CSS 表单

    表单布局 Bootstrap 提供了下列类型的表单布局: 垂直表单(默认) 内联表单 水平表单 垂直或基本表单 基本的表单结构是 Bootstrap 自带的,个别的表单控件自动接收一些全局样式.下面列 ...

  4. Bootstrap<基础六> 表单

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

  5. Bootstrap表单

    Bootstrap 提供了下列类型的表单布局: 垂直表单(默认) -> 这个不好看,都是手机版了,PC版占一排不好看: 内联表单 -> 我相信这个才是你想要的,PC版响应横排,手机版响应竖 ...

  6. Bootstrap学习笔记系列3-------Bootstrap简单表单显示

    表单布局 垂直或基本表单 基本的表单结构时BootStrap自带的,创建基本表单的步骤如下: 向父<form>元素添加role = "form": 为了获取最佳的间距, ...

  7. bootstrap学习总结-05 常用标签3

    1 单选框,多选框 1)单选框 单选框(radio)用于从多个选项中只选择一个.设置了 disabled 属性的单选或多选框都能被赋予合适的样式.对于和多选或单选框联合使用的 <label> ...

  8. bootstrap学习笔记之一

    一.概要 bootstrap是最受欢迎的HTML.css和js框架,用于开发响应式布局,移动设备优先的WEB项目. 二.CSS部分 1.bootstrap已经设定了基本的全局样式,如font-fami ...

  9. bootstrap入门-4.排版及其他固定样式

    本篇包括以下内容:排版.代码.表格.表单. 总结:超无聊,弃更. · 排版样式                                     标题 h1-h6 取消加粗,字体大小也有一定变化 ...

随机推荐

  1. ZOJ3175【公式化函数的思想】

    题意:  给出f(n,m)(m<n)的定义:大于m并且小于n的能整除m的数的个数. F(n)为m从1至n的f(n,m)的和. 给出n,求F(n). 思路: 就是计算n/1 +  n/2 + n/ ...

  2. 各种移动GPU压缩纹理的使用方法

    本文系原创整理,欢迎转载,请标明链接 http://www.cnblogs.com/luming1979 有问题欢迎加qq群讨论:366239605 介绍了各种移动设备所使用的GPU,以及各个GPU所 ...

  3. Python Matplotlib 中对于 bar 显示时间的问题

    参考: 官方教程: http://matplotlib.org/1.3.1/users/recipes.html http://stackoverflow.com/questions/13515471 ...

  4. Sql Server2008R2与IDEA的连接

    数据库的连接笔者搞了一天,参阅了众多连接方案,大部分都是Eclipse和My sql,笔者一遍一遍的调试,终于皇天不负有心人,成绩先摆出来 为了让更多的新手能少走弯路,话不多说,上干货 首先,我们需要 ...

  5. 在Mac上安装Ubuntu14.04虚拟机

    1.在macOS High Sierras上安装VMware for mac 下载地址:VMware Fusion 8.5.1  https://pan.baidu.com/s/1skQ1OyL 2. ...

  6. @PathVariable注解的使用

    带占位符的 URL 是 Spring3.0 新增的功能,该功能在SpringMVC 向 REST 目标挺进发展过程中具有里程碑的意义. 通过 @PathVariable 可以将 URL 中占位符参数绑 ...

  7. OSPF-1-OSPF的数据库交换（5）

    三.LAN中的指定路由器   没有DR概念的话,共享同一条数据链路的一对路由器会形成完整的邻接关系,每对路由器之间都会直接交换它们的LSDB,假设在一个只有6台路由器的LAN中,其中没有DR,那么就会 ...

  8. jmeter diff测试（调用JAR包处理）

    1.准备接口数据(对比字段,即json数据中需要提取的key对应的值进行对比) 2.配置获取EXCEL数据 3.新建线程,并建两个http请求,分别用于请求新旧接口 4.提取需要对比的内容 5.赋值变 ...

  9. vue样式操作与事件绑定

    Vue笔记 1 Vue实例 (VM) var vm = new Vue({    el:'#app', //挂载元素        //数据    data: {        title:'值', ...

  10. 4G牌照影响

    与3G牌照发放整整讨论了10年不同,4G牌照发放在2009年3G规模建设4年后就进行了发放,也颇匹配于行业的加速度.那么,4G到底会在哪些方面.在何种程度上改变中国呢?其实,4G的影响可能没有那么大, ...