Bootstrap笔记一

   前言：本blog文章仅作个人记录复习bootstrap的标签用法等，过程中使用了官方中文文档的部分示例代码，并无用作商业作用，如若侵权请告知本人删除。另外如果有幸有人观看发现用词不严谨的问题也可告知，虚心求教，谢谢 。

1.改变大小写
.text-lowercase :全体英文小写
.text-uppercase :全体英文大写
.text-capitalize:首字母英文大写

2.对齐
.text-left:左对齐
.text-center:居中对齐
.text-right:右对齐

3.缩略语
attr
abbr标签是缩略语标签，“attr”是缩略文本，将鼠标移动上去静止0.8秒左右(有误差)，显示完整文本“attribute”

4.引用（blockquote）

右对齐引用（blockquote-reverse）

<blockquote class="blockquote-reverse">
    <p>今天是马化腾生日,不管是和日本人打赌,还是唱中国人,转发三个群再看你的扣扣头像,会变成尊贵会员</p>
    <footer><cite>白岩松</cite></footer>
</blockquote>

 blockquote标签中的footer内部标签为浅灰色，cite则会显示为斜体.

5.无序列表（ul）

• 
  
• 无样式无序列表
• 为中华之崛起而读书
• 为中华之崛起而读书
• 为中华之崛起而读书
• 为中华之崛起而读书
• 为中华之崛起而读书
• 为中华之崛起而读书

<ul class="list-unstyled">
    <li>无样式无序列表</li>
    <li>为中华之崛起而读书</li>
    <li>为中华之崛起而读书</li>
    <li>为中华之崛起而读书</li>
    <li>为中华之崛起而读书</li>
    <li>为中华之崛起而读书</li>
    <li>为中华之崛起而读书</li>
</ul>

ps：list-unstyled效果类似于CSS代码：list-style: none

6.内联样式

• 你好
• 我好
• 大家好

<ul class="list-inline">
    <li>你好</li>
    <li>我好</li>
    <li>大家好</li>
</ul>

设置 display: inline-block; 并添加5px的内补(padding)