Bootstrap对<h1>
到<h6>
的标题元素都进行的样式预设,可直接使用。
h1. Bootstrap heading |
h2. Bootstrap heading |
h3. Bootstrap heading |
h4. Bootstrap heading |
h5. Bootstrap heading |
h6. Bootstrap heading |
<h1>h1. Bootstrap heading</h1> <h2>h2. Bootstrap heading</h2> <h3>h3. Bootstrap heading</h3> <h4>h4. Bootstrap heading</h4> <h5>h5. Bootstrap heading</h5> <h6>h6. Bootstrap heading</h6>
在标题中Bootstrap对<small>
标签或使用.small
类的元素进行了预设,用以作为副标题。副标题会为灰色,比主标题字体大小略小。
h1. Bootstrap heading Secondary text |
h2. Bootstrap heading Secondary text |
h3. Bootstrap heading Secondary text |
h4. Bootstrap heading Secondary text |
h5. Bootstrap heading Secondary text |
h6. Bootstrap heading Secondary text |
<h1>h1. Bootstrap heading <small>Secondary text</small></h1> <h2>h2. Bootstrap heading <small>Secondary text</small></h2> <h3>h3. Bootstrap heading <small>Secondary text</small></h3> <h4>h4. Bootstrap heading <small>Secondary text</small></h4> <h5>h5. Bootstrap heading <small>Secondary text</small></h5> <h6>h6. Bootstrap heading <small>Secondary text</small></h6>
Bootstrap在全局将<body>
元素和所有的段落元素都默认设置成font-size
为14px,设置line-height
为1.428。另外,<p>
元素还被设置了等于1/2行高(即 10px)的底部外边距(margin-bottom
)。
示例:
You can use the mark tag to highlight text.
源码:
You can use the mark tag to <mark>highlight</mark> text.
示例:
This line of text is meant to be treated as deleted text.
源码:
<del>This line of text is meant to be treated as deleted text.</del>
示例:
This line of text is meant to be treated as no longer accurate.
源码:
<s>This line of text is meant to be treated as no longer accurate.</s>
示例:
This line of text is meant to be treated as an addition to the document.
源码:
<ins>This line of text is meant to be treated as an addition to the document.</ins>
示例:
This line of text will render as underlined
源码:
<u>This line of text will render as underlined</u>
示例:
This line of text is meant to be treated as fine print.
源码:
<small>This line of text is meant to be treated as fine print.</small>
示例:
The following snippet of text is rendered as bold text.
源码:
<strong>rendered as bold text</strong>
示例:
The following snippet of text is rendered as italicized text.
源码:
<em>rendered as italicized text</em>
示例:
To switch directories, type cd followed by the name of the directory.
To edit settings, press ctrl + ,
源码:
To switch directories, type <kbd>cd</kbd> followed by the name of the directory.<br> To edit settings, press <kbd><kbd>ctrl</kbd> + <kbd>,</kbd></kbd>
示例:
Lowercased text. |
Uppercased text. |
Capitalized text. |
源码:
<p class="text-lowercase">Lowercased text.</p> <p class="text-uppercase">Uppercased text.</p> <p class="text-capitalize">Capitalized text.</p>
示例:
Left aligned text. |
Center aligned text. |
Right aligned text. |
Justified text. |
No wrap text. |
源码:
<p class="text-left">Left aligned text.</p> <p class="text-center">Center aligned text.</p> <p class="text-right">Right aligned text.</p> <p class="text-justify">Justified text.</p> <p class="text-nowrap">No wrap text.</p>
示例:
Twitter, Inc.源码:
<address> <strong>Twitter, Inc.</strong><br> 1355 Market Street, Suite 900<br> San Francisco, CA 94103<br> <abbr title="Phone">P:</abbr> (123) 456-7890 </address> <address> <strong>Full Name</strong><br> <a href="mailto:#">first.last@example.com</a> </address>
示例:
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.
源码:
<blockquote> <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.</p> </blockquote>
示例:
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.
源码:
<blockquote> <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.</p> <footer>Someone famous in <cite title="Source Title">Source Title</cite></footer> </blockquote>
示例:
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.
源码:
<blockquote class="blockquote-reverse"> ... </blockquote>