bootstrap笔记

8. rem的使用方法：

首先，先说一个常识，浏览器的默认字体高都是16px。

兼容性：

目前，IE9+，Firefox、Chrome、Safari、Opera 的主流版本都支持了rem。

就算浏览器不支持，就多写一个绝对单位的声明。这时不支持的浏览器会忽略用rem设定的字体大小，选择绝对单位字体的大小。

使用%单位方便使用

css中的body中先全局声明font-size=62.5%，这里的%的算法和rem一样。

因为100%=16px，1px=6.25%，所以10px=62.5%,这是的1rem=10px，所以12px=1.2rem。

px与rem的转换通过10就可以得来，方便了吧！

使用方法

注意: rem是只相对于根元素htm的font-size，即只需要设置根元素的font-size，>>其它元素使用rem单位设置成相应的百分比即可；

简单的说：就是 1rem 的大小就是html设置的字体大小.
例如：html设置的字体大小是16px；那么 1rem 就是 16px ;

<div class="container">
    <div class="row align-items-start bg-success text-white" style="height: 100px" >
        <div class="col">One of three columns</div>
        <div class="col">One of three columns</div>
        <div class="col">One of three columns</div>
    </div>
    <div class="row align-items-center bg-info text-white" style="height: 100px">
        <div class="col">One of three columns</div>
        <div class="col">One of three columns</div>
        <div class="col">One of three columns</div>
    </div>
    <div class="row align-items-end bg-secondary text-white" style="height: 100px">
        <div class="col">One of three columns</div>
        <div class="col">One of three columns</div>
        <div class="col">One of three columns</div>
    </div>
</div>

标签：16px,字体大小,bootstrap,three,笔记,rem,font,columns
来源： https://www.cnblogs.com/Mamba-fight/p/11300336.html