Bootstrap5笔记(2)上
本帖最后由 歌者文明清理员 于 2023-6-20 23:32 编辑墙裂建议订阅一下Bootstrap5官方教程
源地址：https://fishc.com.cn/thread-229745-1-1.html
下半部分：https://fishc.com.cn/thread-229907-1-1.html
Bootstrap 的 css 对 h1~h6 的标签样式进行了设定。
一个最基础的代码：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>第一个BootStrap5程序</title>
<!-- 必须引入 -->
<link rel="stylesheet" href="css/bootstrap.css">
</head>
<body>
<h1>h1</h1>
<h2>h2</h2>
<h3>h3</h3>
<h4>h4</h4>
<h5>h5</h5>
<h6>h6</h6>
<!-- 必须引入 -->
<script src="js/bootstrap.js"></script>
</body>
</html>
效果：
https://t3.wodetu.cn/2023/06/20/72ba8f1437ca07a1e2e20b300b99c314.png
Bootstrap5 还提供了 class 属性的 h1~h6。新代码：
<p class="h1">假h1</p>
<p class="h2">假h2</p>
<p class="h3">假h3</p>
<p class="h4">假h4</p>
<p class="h5">假h5</p>
<p class="h6">假h6</p>
效果（不知道为啥 macOS 里不行）
https://t4.wodetu.cn/2023/06/20/1f544f439b31be2b4630967b24795a41.png
另外，在 h1~h6 里面套上 small 标签可以做到变小那么一丢丢；
<h1>h1
<small>h1</small>
</h1>
<h2>h2
<small>h2</small>
</h2>
<h3>h3
<small>h3</small>
</h3>
<h4>h4
<small>h4</small>
</h4>
<h5>h5
<small>h5</small>
</h5>
<h6>h6
<small>h6</small>
</h6>
效果：
https://t1.wodetu.cn/2023/06/20/d2a7ac5cddf925c7afddd5e56d1e333a.png
未完待续... 这？挺简单
页:
[1]