Bootstrap复习笔记

01、

<p>You can use the mark tag to <mark>highlight</mark> text. 标记文本</p>
<p><del>This line of text is meant to be treated as deleted text.</del>被删除的文本</p>
<p><s>This line of text is meant to be treated as no longer accurate.</s>无用文本</p>
<p><ins>This line of text is meant to be treated as an addition to the document.</ins>插入文本</p>
<p><u>This line of text will render as underlined</u>带下划线的文本</p>
<p><small>This line of text is meant to be treated as fine print.</small>小号文本</p>
<p>The following snippet of text is <strong>rendered as bold text</strong>.着重</p>
<p>The following snippet of text is <em>rendered as italicized text</em>.斜体</p>

02、

<ul class="list-unstyled">移除了默认的 list-style 样式和左侧外边距

<ul class="list-inline">设置 display: inline-block; 并添加少量的内补(padding),将所有元素放置于同一行

03、

<pre class="pre-scrollable">
    <p>Sample text here...</p>
</pre>

04、

通过 <var> 标签标记变量<var>y</var> = <var>m</var><var>x</var> + <var>b</var>

通过 <samp> 标签来标记程序输出的内容。<samp>This text is meant to be treated as sample output from a computer program.</samp>

05、

<th scope="row">1</th>

06、

image

07、

如果 <a> 元素被作为按钮使用 -- 并用于在当前页面触发某些功能 -- 而不是用于链接其他页面或链接当前页面中的其他部分,那么,务必为其设置 role="button"属性

<a class="btn btn-default" href="#" role="button">Link</a>

8、

Bootstrap 提供了三个可对图片应用简单样式的 class:

  • .img-rounded:添加 border-radius:6px 来获得图片圆角。
  • .img-circle:添加 border-radius:500px 来让整个图片变成圆形。
  • .img-thumbnail:添加一些内边距(padding)和一个灰色的边框。

9、

如果需要让使用了 .img-responsive 类的图片水平居中,请使用 .center-block 类,不要用 .text-center

10、

.pull-left {float: left !important;}

.pull-right {float: right !important;}

导航

.navbar-left.navbar-right

11、

<div class="center-block">...</div>代替margin:0 auto;

12、

.visible-xs-
.visible-sm-

.visible-md-

.visible-lg-


.hidden-xs-
.hidden-sm-
.hidden-md-
.hidden-lg-

原文地址:https://www.cnblogs.com/xiaoky/p/4664640.html