您的位置:首页 > Web前端 > BootStrap

Bootstrap中文本的样式

2015-11-12 13:33 369 查看
在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。

文本样式当然做出了适当的改变,具体是哪些地方做出了改变,我也没有办法描述,在实际的工作中我们也许会一个一个的进行试验,当出现合适的就去选择。在这个地方我们仅仅是要熟悉存在这些样式。
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: