bootstrap字体颜色怎么改


本文摘自PHP中文网,作者(*-*)浩,侵删。

先来看看bootstrap自定义的文本颜色是什么样的:

代码:(推荐学习:Bootstrap视频教程)

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

<!DOCTYPE html>

<html>

  <head>

    <meta charset="utf-8">

    <meta http-equiv="X-UA-Compatible" content="IE=edge">

    <meta name="viewport" content="width=device-width, initial-scale=1">

    <!-- 上述3个meta标签*必须*放在最前面,任何其他内容都*必须*跟随其后! -->

    <link rel="stylesheet" href="bootstrap.css">

    <title>Bootstrap 101 Template</title>

    <style>

          p{font-size:50px;}

    </style>

     

  </head>

  <body>

              <p>我是muted</p>

              <p>我是primary</p>

              <p>我是success</p>

              <p>我是info</p>

              <p>我是warning</p>

              <p>我是danger</p>         

    <script src="jquery.js"></script>

    <script src="bootstrap.js"></script>

  </body>

</html>

打开Bootstrap.css , 搜索text-muted:

结果如下:

vs.png

这样我们就可以看出默认情况下bootstrap给出的文本颜色样式为:

1

2

3

4

5

6

7

8

9

10

11

.text-muted{  color: #777 ;  }

 

.text-primary{  color: #337ab7 ;  }

 

.text-success{  color: #3c763d ;  }

 

.text-info{  color: #31708f ;  }

 

.text-warning{  color: #8a6d3b ;  }

 

.text-danger{  color: #a94442 ;  }

我们也可以基于这些样式进行修改和添加,得到符合自己需求的样式。

更多Bootstrap相关技术文章,请访问Bootstrap教程栏目进行学习!

以上就是bootstrap字体颜色怎么改的详细内容,更多文章请关注木庄网络博客

相关阅读 >>

rocketbootstrap是什么

bootstrap中如何设置表单的宽高

bootstrap为什么弹出框没有内容

bootstrap如何解决浏览器兼容性问题

bootstrap模态框有什么用

css中的bootstrap是指什么

浅谈bootstrap blazor组件的使用方法

bootstrap模态框如何加滚动条

什么是bootstrap栅格系统的单位

bootstrap特点是什么意思

更多相关阅读请进入《bootstrap》频道 >>




打赏

取消

感谢您的支持,我会继续努力的!

扫码支持
扫码打赏,您说多少就多少

打开支付宝扫一扫,即可进行扫码打赏哦

分享从这里开始,精彩与您同在

评论

管理员已关闭评论功能...