bootstrap 学习总结.docx

Bootstrap学$,对于一些重要的文本,希望突出强调的部分都会做另外的样式处理。Bootstrap同样对这部分做了一些轻量级的处理。如果想让一个段落p突出显示,可以通过添加类名“.lead”实现,其作用就是增大文本字号,加粗文本,而且对行高和margin也做相应的处理。用法如下:<p>我是普通文本,我的样子长成这样我是普通文本,我的样子长成这样我是普通文本,</p><pclass="lead">我是特意要突出的文本,我的样子成这样。我是特意要突出的文本,我的样子长成这样。</p>效果查看最右侧结果窗口。“.lead”对应的样式如下:/*~480行*/.lead{margin-bottom:20px;font-size:16px;font-weight:200;line-height:;}***@media(min-width:768px){/*大中型浏览器字体稍大*/.lead{font-size:21px;}}除此之外,Bootstrap还通过元素标签:<small>、<strong>、<em>和<cite>给文本做突出样式处理。/*~第58行*/b,strong{font-weight:bold;/*文本加粗*/}/*~第484行*/small,.small{font-size:85%;/*标准字体的85%,也就是14px*,差不多12px*/}/*~第487行*/cite{font-style:normal;}$,在普通的元素中我们一般通过font-weight设置为bold关键词给文本加粗。在Bootstrap中,可以使用<b>和<strong>标签让文本直接加粗。/*~第58行*/b,strong{font-weight:bold;/*文本加粗*/}例如,下面的代码使用<strong>标签定义了强调文本:<p>我在学习<strong>Bootstrap</strong>,我要掌握<strong>Bootstrap</strong>的所有知识。</p>$,除了用加粗来强调突出的文本之外,还可以使用斜体。斜体类似于加粗一样,除了可以给元素设置样式font-style值为italic实现之外,在Bootstrap中还可以通过使用标签<em>或<i>来实现。例如,下面的代码使用了<em>和<i>标签定义了强调文本:<p>我在慕课网上跟<em>大漠</em>一起学习<i>Bootstrap</i>的使用。我一定要学会<i>Bootstrap</i>。</p>$<strong>、<em>等说明正文某些字词、句子的重要性,Bootstrap还定义了一套类名,这里称其为强调类名(类似前面说的“.lead”),这些强调类都是通过颜色来表示强调,具本说明如下:.text-muted:提示,使用浅灰色(#999).text-primary:主要,使用蓝色(#428bca).text-ess:成功,使用浅绿色(#3c763d).text-info:通知信息,使用浅蓝色(#31708f).text-warning:警告,使用黄色(#8a6d3b).text-danger:危险,使用褐色(#a94442)~第532行:.text-muted{color:#999;}.text-primary{color:#428bca;}-primary:hover{color:#3071a9;}.text-ess{color:#3c763d;}-ess:hover{color:#2b542c;}.text-info{color:#31708f;}-info:hover{color:#245269;}.text-warning{color:#8a6d3b;}-warning:hover{color:#66512c;}.text-danger{color:#a94442;}-danger:hover{color:#843534;}$。在CSS中常常使用text-align来实现文本的对齐风格的设置。其中主要有四种风格: ☑ 左对齐,取值left ☑ 居中对齐,取值center ☑ 右对齐,取值right ☑ 两端对齐,取值justif