免费AI编程助手
Bootstrap 段落
2018-03-04 18:02 更新
Bootstrap的全局默认字体大小为14px，行高为1.428。这适用于<body>和所有段落。此外，<p>（段落）接收一半的计算线高的底部边距（默认为10像素）。
<!DOCTYPE HTML>
<html>
<head>
<link href="//www.w3cschool.cn/statics/plugins/bootstrapold/css/bootstrap.min.css" rel="stylesheet">
</head>
<body style="margin:20px;">
<p>This is a paragraph.</p>
</body>
</html>主要段落
通过添加 .lead 使一个段落突出。
<!DOCTYPE HTML>
<html>
<head>
<link href="//www.w3cschool.cn/statics/plugins/bootstrapold/css/bootstrap.min.css" rel="stylesheet">
</head>
<body style="margin:20px;">
<p class="lead">This is a test.</p>
</body>
</html>段落对齐
我们可以使用以下三个类来控制段落的文本对齐。
<!DOCTYPE HTML>
<html>
<head>
<link href="//www.w3cschool.cn/statics/plugins/bootstrapold/css/bootstrap.min.css" rel="stylesheet">
</head>
<body style="margin:20px;">
<p class="text-left">Left aligned text.</p>
<p class="text-center">Center aligned text.</p>
<p class="text-right">Right aligned text.</p>
</body>
</html>有意义的段落
通过颜色与一些重要实用的类传递意义。
<!DOCTYPE HTML>
<html>
<head>
<link href="//www.w3cschool.cn/statics/plugins/bootstrapold/css/bootstrap.min.css" rel="stylesheet">
</head>
<body style="margin:20px;">
<p class="text-muted">text-muted</p>
<p class="text-primary">text-primary</p>
<p class="text-warning">text-warning</p>
<p class="text-danger">text-danger</p>
<p class="text-success">text-success</p>
<p class="text-info">text-info</p>
</body>
</html>以上内容是否对您有帮助：
更多建议：