Bootstrap 学 Bootstrap 使用的某些 HTML 元素和 CSS 属性需要文档类型为 HTML5 的文件类型。因此这一文档类型必须出现在项目的每个页面的开始部分?<!DOCTYPE html> ?<html lang="en"> ?... ?</html> HTML 中定义的所有标题标签,从<h1> 到<h6> 都是可用的。 Bootstrap 定义的全局 font-size 是 14px , line-height 是 20px 。这些样式应用到了<body> 和所有的段落上。另外,对<p> ( 段落) 还定义了 1/2 行高( 默认为 10px) 的底部外边距(margin) 属性。在使用 Bootstrap 之前必须要将 或者 ( 压缩版) 引入到页面中, 它定义了 Bootstrap 的基本样式。如果需要使用 Bootstrap 提供的组件,要将 s 或者 ( 压缩版) 引入到页面中。因为 bootstrap 的 JS 插件需要 Jquery 的支持, 所有在引入 之前必须将 也引入到页面上。另外如果你希望你的页面支持响应式布局, 必须引入 bootstrap- 或者 bootstrap- ( 压缩版), 它主要提供页面在移动设备上的显示样式支持,需要注意的是 bootstrap- 必须放置在 之后,否则便不具有响应式布局功能。当然在 Bootstrap 3 的版本中, 和 bootstrap- 已经合并了。一、代码样式 Bootstrap 提供了代码样式, 用于在页面上展示代码, 以此来区分于正文的区别, 如果是行内嵌套代码,可以用<code> 标签,但是对于代码中的符号要进行转换( < 是<、> 是>) 例如: ?<!-- 正文中内嵌代码块--> ?<p>For example, <code><section></code> should be wrapped as inline.</p> 如果是代码块可以用<pre > 标签,同样的,代码中的要将代码中的尖括号做转换。例如: ?<!--.pre-scrollable ,其作用是设置 max-height 为 350px ,并在垂直方向展示滚动条--> ?<pre class="pre-scrollable"> ??<p>Sample text here...</p> ?<p class="text-muted">...</p> ?<p class="text-primary">...</p> ?<p class="text-ess">...</p> ?<p class="text-info">...</p> ?<p class="text-warning">...</p> ??<p class="text-danger">...</p> ????</pre> 二、表格基本的表格样式可以用<table> 标签。例如: ?<h4> 正常表格</h4> ?<!-- ?-bordered 为表格和其中的每个单元格增加边框?-striped 可以给<tbody> 之内的每一样增加斑马条纹样式?-hover 可以让<tbody> 中的每一行响应鼠标悬停状态?--> ?<table class="table table-striped table-bordered table-hover"> ?<tr> ?<th>First Name</th> ??<th>Last Name</th> ??<th>Username</th> ??</tr> ??<tr> ??<td>Mark</td> ??<td>Otto</td> ??<td>***@mdo</td> ??</tr> ??<tr> ??<td>Jacob</td> ??<td>Thornton</td> ??<td>***@fat</td> ??</tr> ??</table> -condensed 类, 如果想为表格添加颜色可以选择情景类,情景类有: .ess 表示成功或积极的行为。.error 表示一个危险或存有潜在危险
Bootstrap使用笔记 来自淘豆网m.daumloan.com转载请标明出处.
