.text-五种颜色 文本颜色
.text-info文本浅蓝颜色-提示
.text-warning文本黄色-警告颜色
.text-success文本绿色-成功颜色
.text-primary文本深蓝色-警告颜色
.bg-五中颜色 背景颜色
.bg-warning文本红色背景
.bg-success文本绿色背景
.bg-info文本浅蓝色背景
.bg-warning文本黄色背景
.bg-primary文本绿色背景
1 <head> 2 <meta charset="utf-8"> 3 <meta http-equiv="X-UA-Compatible" content="IE=edge"> 4 <meta name="viewport" content="width=device-width, initial-scale=1"> 5 <title>Bootstrap 101 Template</title> 6 7 <!-- Bootstrap --> 8 <link href="css/bootstrap.css" rel="stylesheet"> 9 10 <!--[if lt IE 9]> 11 <script src="js/html5shiv.min.js"></script> 12 <script src="js/respond.min.js"></script> 13 <![endif]--> 14 </head> 15 <body> 16 <h3>文本相关class</h3> 17 <p class="text">文本的五种颜色</p> 18 <p class="text-info">文本浅蓝颜色-提示</p> 19 <p class="text-warning">文本黄色-警告颜色</p> 20 <p class="text-success">文本绿色-成功颜色</p> 21 <p class="text-primary">文本深蓝色-警告颜色</p> 22 23 <P class="bg">文本背景五种颜色</P> 24 <P class="bg-warning">文本红色背景</P> 25 <P class="bg-success">文本绿色背景</P> 26 <P class="bg-info">文本浅蓝色背景</P> 27 <P class="bg-warning">文本黄色背景</P> 28 <P class="bg-primary">文本绿色背景</P> 29 30 <p class="text-uppercase">jshfjskhkjdshkfhdsjkhfdkj</p><!--文本转大写形式--> 31 <p class="text-lowercase">SHDJASHJDKHAJSKHDJKDASHDH</p><!--文本转小写形式--> 32 <p class="text-capitalize">jsdklajslkdjkaljsdkljaskj</p><!--文本首字母与大写形式--> 33 <p class="text-left">文本左对齐</p> 34 <p class="text-center">文本居中对齐</p> 35 <p class="text-right">文本右对齐</p> 36 <p class="text-justify">文本两端对齐</p> 37 38 <br><br> 39 <script src="js/jquery-1.11.3.js"></script> 40 <script src="js/bootstrap.js"></script> 41 </body> 42 </html>