---恢复内容开始---

可以用class=“h1”等给元素加h1样式

<h>------<small>----</small></h>     <small>是副标题

class="lead"     强调文本,突出显示

<strong>---</strong>     粗体

<i>---</i>   <em>---</em>     斜体

  • text-muted:提示,使用浅灰色(#999)                                                                                                                text-left                 文本向左对齐                                                           .table:基础表格
  • .text-primary:主要,使用蓝色(#428bca)                                                                                                           text-right               文本向右对齐                                                           .table-striped:斑马线表格
  • .text-success:成功,使用浅绿色(#3c763d)                                                                                                           text-center             文本居中对齐                                                           .table-bordered:带边框的表格
  • .text-info:通知信息,使用浅蓝色(#31708f)                                                                                                        text-justify            文本两端对齐                                                            .table-hover:鼠标悬停高亮的表格
  • .text-warning:警告,使用黄色(#8a6d3b)                                                                                                                                                                                                                       .table-condensed:紧凑型表格
  • .text-danger:危险,使用褐色(#a94442)                                                                                                                                                                                                                         .table-responsive:响应式表格

class=“list-inline”     内联列表,简单说就是水平的没有符号的列表,为导航而生

自定义列表中加class=“dl-horizontal”    自定义水平列表

在网页上插入代码有三种<code>单行</code>     <pre>多行</pre>     <kbd>用户用键盘操作</kbd>     无论是哪一个  小于号用&lt,大于号用&gt

<pre class="pre-scrollable">多行代码是,又不想让其占用过多面积,此类可以出现滚动条,高度限定为340px

类名 描述
.active 表示当前活动的信息
.success 表示成功或者正确的行为
.info 表示中立的信息或行为
.warning 表示警告,需要特别注意
.danger 表示危险或者可能是错误的行为

水平表单class=“form-horizontal”

内联表单class=“form-inline”

<div class="form-group"><input type="--" class="form-control" placehoder="Enter email"></div>

下拉选择框(滚动条模式的话,在select中加multiple)

<div class="form-group">

<select class="form-control">

<option></option>

<option></option>

<option></option>

</select>

</div>

文本域和原始使用方法一样,设置rows可定义其高度,设置cols可以设置其宽度。但如果textarea元素中添加了类名“form-control”类名,则无需设置cols属性。因为Bootstrap框架中的“form-control”样式的表单控件宽度为100%auto

<form role="form">

  <div class="form-group">

    <textarea class="form-control" rows="3"></textarea>

  </div>

</form>

复选框checkbox和单选择按钮radio      水平排列加inline

<form role="form">
<div class="form-group">
<input type="email" class="form-control" placeholder="Enter email">
</div>
</form>

---恢复内容结束---

可以用class=“h1”等给元素加h1样式

<h>------<small>----</small></h>     <small>是副标题

class="lead"     强调文本,突出显示

可以用class=“h1”等给元素加h1样式

<h>------<small>----</small></h>     <small>是副标题

class="lead"     强调文本,突出显示

在慕课学习Bootstrap的更多相关文章

  1. bootstrap插件学习-bootstrap.dropdown.js

    bootstrap插件学习-bootstrap.dropdown.js 先看bootstrap.dropdown.js的结构 var toggle = '[data-toggle="drop ...

  2. bootstrap插件学习-bootstrap.modal.js

    bootstrap插件学习-bootstrap.modal.js 先从bootstrap.modal.js的结构看起. function($){ var Modal = function(){} // ...

  3. 如何快速轻松学习bootstrap

    我以前也是通过看一些视频教程来学的,比如慕课网上的,比如51cto上的那些零基础入门bootstrap什么的,还有一些培训班里流传出来的,感觉晕乎乎的,不知所云. 还是在后面不断使用的过程中慢慢体会到 ...

  4. bootstrap插件学习-bootstrap.typehead.js

    先看bootstrap.typehead.js的结构 var Typeahead = function ( element, options ){} //构造器 Typeahead.prototype ...

  5. bootstrap插件学习-bootstrap.carousel.js

    先看bootstrap.carousel.js的结构 var Carousel = function (element, options){} //构造器 Carousel.prototype = { ...

  6. bootstrap插件学习-bootstrap.collapse.js

    先看bootstrap.collapse.js的结构 var Collapse = function ( element, options ){} // 构造器 Collapse.prototype ...

  7. bootstrap插件学习-bootstrap.alert.js

    我们先看bootstrap.alert.js的结构 var dismiss = '[data-dismiss="alert"]' //自定义属性 Alert = function ...

  8. bootstrap插件学习-bootstrap.button.js

    先看bootstrap.button.js的结构 var Button = function ( element, options ){} //构造器 Button.prototype = {} // ...

  9. bootstrap插件学习-bootstrap.popover.js

    先看bootstrap.popover.js的结构 var Popover = function ( element, options ){} //构造器 Popover.prototype = {} ...

随机推荐

  1. J2EE程序员应该要掌握的linux知识

    J2EE程序员应该要掌握的linux知识 大型J2EE应用都在建构在linux环境下的.开发环境下我们可以通过samba映射成本地的网络驱动器,直接在windows环境下进行编程调试.但是最后的发布还 ...

  2. 读取AD模拟分量

    //EEPROM数据保存---------------------- #include <EEPROM.h> #define EEPROM_write(address, p) {int i ...

  3. 【HMTL】文字飞舞的美

    这是在一个大神那看到的就拿过来了,希望能够更多人能看到. 这个是效果: 源文件下载: 点 击 下 载

  4. 开始使用版本控制,局域网搭个SVN

    话说以前自己做的一些小项目,经常出现忘记保存.突然断电等令人抓狂的事情.后来想到的办法是备份,这备份又有一个进化的过程,最先是建一个文件夹,隔一段时间压缩一下放进去,但是这个命名实在是麻烦,后来傻乎乎 ...

  5. Android学习笔记(2)

    今天我继续看Mars老师的Android开发视频教程,看到一个“深入LinearLayout”的时候,发现一个比较好玩的技巧. 控件的layout_weight属性,他是父控件剩余空间的比例. 如果把 ...

  6. c# 路径空格---ProcessStartInfo参数问题

    今天在整合程序的时候,要从一个程序转到另一个程序 当然要使用:   ProcessStartInfo startInfo = new ProcessStartInfo("\\Program ...

  7. 使用VS2012 开发SharePoint 2013 声明式的action(activity) 综合实例

    本文讲述使用VS2012 开发SharePoint 2013 声明式的action 综合实例. 需求同: http://blog.csdn.net/abrahamcheng/article/detai ...

  8. Apache Solr采用Java开发、基于Lucene的全文搜索服务器

    http://docs.spring.io/spring-data/solr/ 首先介绍一下solr: Apache Solr (读音: SOLer) 是一个开源.高性能.采用Java开发.基于Luc ...

  9. JS 文本输入框放大镜效果

    JS 文本输入框放大镜效果 今天下午研究了下 "文本输入框放大镜效果" 当然KISSY官网也有这种组件 请看kissy demo 其实这种效果 对于很多童鞋来说 应该并不陌生!我今 ...

  10. EasyBCD 2.2中文版安装变色龙wowpc.iso详细教程(适用各个版本)

    第一章 安装变色龙引导本章节提供3种安装方案,请自行选择 1.使用 Windows 版变色龙安装器安装适用引导方案:BIOS+MBR第1步:下载 Chameleon Install 2.2svn228 ...