当您需要在一个水平表单内表单标签后放置纯文本时,请在 <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. Unity Mecanim在大型mmo中的应用

    http://blog.csdn.net/langresser_king/article/details/37760091?utm_source=tuicool&utm_medium=refe ...

  2. Oculus Rift, HTC Vive, SONY PSVR的全面对比

    http://blog.csdn.net/xoyojank/article/details/50927572 这次有幸参加了GDC 2016, 终于把三大设备体验了个遍, 也试玩了很多不错的VR游戏. ...

  3. IT兄弟连 JavaWeb教程 Servlet会话跟踪 经典案例

    案例需求:编写一个servlet,可以向session中存放一个消息,再编写一个servlet可以从session取得session中存放的这个消息. 案例实现: package com.xdl.se ...

  4. XHTML学习笔记 Part3:核心属性

    1. 3个属性组: 核心属性:class.id 和title属性 国际化属性:dir.lang和xml:lang属性 UI事件:与如下事件关联的属性: onclick.ondoubleclick.on ...

  5. TensorFlow数据集(二)——数据集的高层操作

    参考书 <TensorFlow:实战Google深度学习框架>(第2版) 一个使用数据集进行训练和测试的完整例子. #!/usr/bin/env python # -*- coding: ...

  6. 【微服务】Dubbo初体验

    一.前言 之前微服务这块只用过SpringCloud搭建,但是最近面试会被问到dubbo框架,虽然之前也学了但是都忘了,故写此博客加深印象. 二.原理简介 Dubbo是一个分布式服务框架,以及阿里巴巴 ...

  7. C 语言实例 - 删除字符串中的特殊字符

    C 语言实例 - 删除字符串中的特殊字符 C 语言实例 C 语言实例 删除字符串中的除字母外的字符. 实例 #include<stdio.h> int main() { ]; int i, ...

  8. PostgreSQL-3-DDL数据定义语言

    1.创建/删除新的数据库 \l  查看现有数据库 \h CREATE DATABASE  查看CREATE DATABASE语句说明 \h DROP DATABASE 查看DROP DATABASE语 ...

  9. 消息队列介绍、RabbitMQ&Redis的重点介绍与简单应用

    消息队列介绍.RabbitMQ&Redis的重点介绍与简单应用 消息队列介绍.RabbitMQ.Redis 一.什么是消息队列 这个概念我们百度Google能查到一大堆文章,所以我就通俗的讲下 ...

  10. Executor等系列概念介绍

    这里对几个常见的的名词进行介绍 Executor 这是个接口,只声明了一个方法—— public interface Executor { void execute(Runnable command) ...