很明显第一行左对齐,第二行居中,第三行右对齐。
5.强调class
这些class通过颜色来表示强调。也可以应用于链接,当鼠标盘旋于链接上时,其颜色会变深,就像默认的链接样式。
<h1>强调Class</h1> <p>Maecenas sed diam eget risus varius blandit sit amet non magna.</p> <p>Maecenas sed diam eget risus varius blandit sit amet non magna.</p> <p>.Maecenas sed diam eget risus varius blandit sit amet non magna.</p> <p>Maecenas sed diam eget risus varius blandit sit amet non magna..</p> <p>Maecenas sed diam eget risus varius blandit sit amet non magna..</p> <p>.Maecenas sed diam eget risus varius blandit sit amet non magna.</p> <h1></h1>
四、缩略图
当鼠标悬停在缩写和缩写词上时就会显示完整内容,Bootstrap实现了对HTML的<abbr>元素的增强样式。缩略语元素带有title属性,外观表现为带有较浅的虚线框,鼠标移至上面时会变成带有“问号”的指针。如想看完整的内容可把鼠标悬停在缩略语上, 但需要包含title属性。
基本缩略语
如想看完整的内容可把鼠标悬停在缩略语上, 但需要包含title属性。
<abbr title="attribute">attr</abbr>
看到效果了,就是没办法截到图。
Initialism
为缩略语添加.initialism可以将其font-size设置的更小些。
<abbr title="HyperText Markup Language">HTML</abbr>
还是只上代码自己看效果。
五、地址
让联系信息以最接近日常使用的格式呈现。在每行结尾添加<br>可以保留需要的样式。
<address> <strong>Twitter, Inc.</strong><br> 795 Folsom Ave, Suite 600<br> San Francisco, CA 94107<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>
六、引用
在你的文档中引用其他来源的内容。
默认样式的引用
将任何HTML裹在<blockquote>之中即可表现为引用。对于直接引用,我们建议用<p>标签。
<blockquote> <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.</p> </blockquote>
引用选项
对于标准样式的<blockquote>,可以通过几个简单的变体就能改变风格和内容。
命名来源:添加<small>标签来注明引用来源。来源名称可以放在<cite>标签里面。
<blockquote> <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.</p> <small>Someone famous in <cite title="Source Title">Source Title</cite></small> </blockquote>
会多一个Source Title
另一种展示风格
使用.pull-right可以让引用展现出向右侧移动、对齐的效果。
<blockquote> <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.</p> </blockquote>
向右对齐移动了额,当然也有相应的pull-left。
七、列表
无序列表
顺序无关紧要的一列元素。
<ul> <li>Lorem ipsum dolor sit amet</li> <li>Lorem ipsum dolor sit amet</li> <li>Lorem ipsum dolor sit amet</li> <li>Lorem ipsum dolor sit amet</li> <li>Lorem ipsum dolor sit amet</li> </ul>
这个也很明显和Html的一样。
有序列表
顺序至关重要的一组元素。