Bootstrap4 字体大小根据屏幕改变
生活随笔
收集整理的這篇文章主要介紹了
Bootstrap4 字体大小根据屏幕改变
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
1. 媒體判斷屏幕
html { font-size: 1rem; }@media (min-width: 576px) {html { font-size: 1.25rem; } } @media (min-width: 768px) {html { font-size: 1.5rem; } } @media (min-width: 992px) {html { font-size: 1.75rem; } } @media (min-width: 1200px) {html { font-size: 2rem; } }?
2. 最簡單的辦法
html { font-size: calc(1em + 1vw); }?
3. 其他方法
@import "bootstrap/functions"; @import "bootstrap/variables"; @import "bootstrap/mixins";html {font-size: 1rem; }@include media-breakpoint-up(sm) {html {font-size: 1.1rem;} }@include media-breakpoint-up(md) {html {font-size: 1.2rem;} }@include media-breakpoint-up(lg) {html {font-size: 1.3rem;} }@import "bootstrap";?
總結
以上是生活随笔為你收集整理的Bootstrap4 字体大小根据屏幕改变的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： 一物一码平台如何解决企业窜货问题？
- 下一篇： 软件测试最全面试题，了解一下