Bootstrap中文本的样式

在Bootstrap中对文本的对有很多的关注,也给出了很多的样式,至少在我们自己写网页的时候这些可以不用再去编写这些样式,其实在之前我一直没有很好的理解类,这些其实都是类,我们给class进行赋值其实也是对赋给他一个类或者是赋给他一个选择器。在Bootstrap中我们队文本进行设置的类有哪些,或者是我们可以给class赋哪些值可以达到我们想要的样式。

 <!DOCTYPE html>
 <html>
 <head>
    <meta charset="utf-8">
    <link rel="stylesheet" href="http://libs.baidu.com/bootstrap/3.0.3/css/bootstrap.min.css">
    <script src="http://libs.baidu.com/bootstrap/3.0.3/js/bootstrap.min.js"></script>
    <script type="http://libs.baidu.com/bootstrap/3.0.3/js/bootstrap.min.js"></script>
  <title>Bootstrap 文本</title>
 </head>
 <body>
 <div class="container">
  <h2>文本</h2>
   <p class="text-muted">该段落使用了样式"text-muted".</p>
    <a href="http://www.w3cschool.cc" class="text-muted">链接使用了样式"text-muted"</a>
    <p class="text-primary">该段落是使用了样式"text-primary"</p>
    <a href="http://www.w3cschool.cc" class="text-primary">链接使用该样式</a>
    <p class="text-success">该段落使用了样式"text-success"</p>
    <a href="http://www.w3cschool.cc" class="text-success">该链接使用了样式</a>
    <p class="text-info">该段落使用了样式"text-info"</p>
    <a href="http://www.w3cschool.cc" class="text-info">该链接使用了样式</a>
    <p class="text-warning">该段落使用使用了text-warning</p>
    <a href="http://www.w3cschool.cc" class="text-warning">该链接使用了样式</a>
    <p class="text-danger">该段落使用了text-danger</p>
    <a href="http://www.w3cschool.cc" class="text-danger">该链接使用了样式</a>
</div>
</body>
</html>

在这个程序中我们使用的样式有text-muted,text-success,text-danger,text-warning,text-info,text-primary。

文本样式当然做出了适当的改变,具体是哪些地方做出了改变,我也没有办法描述,在实际的工作中我们也许会一个一个的进行试验,当出现合适的就去选择。在这个地方我们仅仅是要熟悉存在这些样式。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值