Bootstrap5笔记(2)下
本帖最后由 歌者文明清理员 于 2023-6-20 23:33 编辑墙裂建议订阅一下Bootstrap5官方教程
源地址:https://fishc.com.cn/thread-229745-1-1.html
上半部分:https://fishc.com.cn/thread-229905-1-1.html
Bootstrap5 的 class 除了 h1~h6,还有 display-1~display-6。
源码:
<h1 class="display-1">h1</h1>
<h1 class="display-2">h1</h1>
<h1 class="display-3">h1</h1>
<h1 class="display-4">h1</h1>
<h1 class="display-5">h1</h1>
<h1 class="display-6">h1</h1>
效果:
https://t3.wodetu.cn/2023/06/20/0614f2e900b95392a5135c3976de93dc.png
根据相关资料分析,rem 应该是 Bootstrap5 的一种计量单位,比 h1~h6 的大小都大得多。
不信的话你改掉:
<h1>h1</h1>
<h1 class="display-2">h1</h1>
<h1 class="display-3">h1</h1>
<h1 class="display-4">h1</h1>
<h1 class="display-5">h1</h1>
<h1 class="display-6">h1</h1>
发现没有!h1 和 display-6 一样大!
px(像素)和 rem 的换算:
rem = px / 16
Bootstrap 里的字体:
类或标签|字体大小
.display-1|5rem
.display-2|4.5rem
.display-3|4rem
.display-4|3.5rem
.display-5|3rem
.h1,h1,.display-6|2.5rem
.h2,h2|2rem
.h3,h3|1.75rem
.h4,h4|1.5rem
.h5,h5|1.25rem
.h6,h6|1rem {:10_256:}{:10_256:}好速度
页:
[1]