当您需要在一个水平表单内表单标签后放置纯文本时,请在 <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. java读取properties文件的配置信息

    项目开发中,我们一般来向 application.properties 文件中放一些全局配置变量,以便程序中读取使用,本篇内容来演示从properties配置文件中读取键值. 当然,我们不一定写入 a ...

  2. Android开发实践:掌握Camera的预览方向和拍照方向

    http://ticktick.blog.51cto.com/823160/1592267?utm_source=tuicool&utm_medium=referral Android的Cam ...

  3. 我叫mt3.2更新公告

    1.增加装备合成功能 可以用材料将现有的75级紫装升级为80级紫装. 2.增加全新公会副本 增加新的公会副本:神庙外围.掉落可以进阶装备的材料. 3.增加全新个人副本 增加新的个人副本:奴隶市场. 4 ...

  4. 如何使得 python 脚本 不一闪而过

    1.  简单的方法是在最后加上如下语句: os.system("pause") 2. 但是这个不一定有用,原因是可能在之前的代码中发生异常,那么我们看到的效果也是直接一闪而过 办法 ...

  5. atcoder#073D(枚舉)

    題目鏈接: http://arc073.contest.atcoder.jp/tasks/arc073_b 題意: 給出n, m兩個數, n是物品數目, m是背包容量, 接下來n行輸入, wi, vi ...

  6. Mysql 到 Hbase 数据如何实时同步,强大的 Streamsets 告诉你

    很多情况大数据集群需要获取业务数据,用于分析.通常有两种方式: 业务直接或间接写入的方式 业务的关系型数据库同步到大数据集群的方式 第一种可以是在业务中编写代码,将觉得需要发送的数据发送到消息队列,最 ...

  7. centos 7 安装node.js

    Node.js v10.x安装命令 curl --silent --location https://rpm.nodesource.com/setup_10.x | bash - Node.js v5 ...

  8. python多线程的实现

    入门案例 import threading,time ''' #线程的创建有两种方式,.直接调用,.继承 ''' # def run(n): # print('test',n) # #.直接调用 # ...

  9. TopCoder9915(期望dp)

    1.还是逆向. 2.状态是还剩红i黑j张时的期望,这样从0,0往R,B推.注意因为是逆着的,所以到了某一步发现期望为负时直接f[i][j]归零,意义是这之后(在递推中算是这之前)的都不摸了,到这就停( ...

  10. hdu6318( 2018 Multi-University Training Contest 2)

    bryce1010模板 http://acm.hdu.edu.cn/showproblem.php?pid=6318 求逆序数的对数 #include<iostream> #include ...