06_Bootstrap 全局 css 样式_排版1|学习笔记

开发者学堂课程【前端开发框架 Bootstrap 使用教程06_Bootstrap 全局 css 样式_排版1】学习笔记,与课程紧密联系,让用户快速学习知识。

课程地址https://developer.aliyun.com/learning/course/360/detail/4225


06_Bootstrap 全局 css 样式_排版1


目录

一、标题

二、页面主体

三、中心内容


一、标题

HTML 中的所有标题标签<h1>到<h6>均可使用。另外,还提供了.h1 到.h6类,为的是给内联(inline)属性的文本赋予标题的样式。

演示:

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

</head>

<body>

<div class="container”>

<h1>这是一个h1标签</h1l

<h2>这是一个h2标签</h2>

<h3>这是一个h3标签</h3>

<h4>这是一个h4标签</h4>

<h5>这是一个h5标签</h5>

<h6>这是一个h6标签</h6>

</div>

</body>

</html>

在标题内还可以包含<small>标签或赋予.small类的元素,可以用来标记副标题。演示:

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

</head>

<body>

<div class="container”>

<h1>这是一个h1标签<small>这是一个副标题</small></h1>

<h2>这是一个h2标签<small>这是一个副标题</small></h2>

<h3>这是一个h3标签<small>这是一个副标题</small></h3>

<h4>这是一个h4标签<small>这是一个副标题</small></h4>

<h5>这是一个h5标签<small>这是一个副标题</small></h5>

<h6>这是一个h6标签<small>这是一个副标题</small></h6>

</div>

</body>

</html>


二、页面主体

Bootstrap 将全局 font-size 设置为14px,line-height 设置为1.428。这些属性直接赋予<body>元素和所有段落元素。另外,<p>(段落)元素还被设置了等于1/2行高(即10px)的底部外边距(margin)。演示:

<p>欢迎来到尚学堂,希望您能通过本套课程以及Bootstrap中文网来深入学习Bootstrap开源框架<br>

欢迎来到尚学堂,希望您能通过本套课程以及Bootstrap中文网来深入学习Bootstrap开源框架

</p>  

<p>欢迎来到尚学堂,希望您能通过本套课程以及Bootstrap中文网来深入学习Bootstrap开源框架</p>

</div>

</body>

</htmL>


三、中心内容

中心内容:通过添加 .lead 类可以让段落突出显示。

<p class="lead">…</p>

上一篇:php开发微信支付获取用户地址


下一篇:浅谈.NET程序集安全签名