<link rel="shortcut icon" href="" type="image/x-icon"> 网页t图标
rem,em设置单位的区别
body部分
<section>
<div>
<p>hahahhahqha</p>
</div>
</section>
CSS部分
<style>
html{
font-size: 20px;
}
section{
/* rem是根据html里面设置的字体大小算的,size*rem=px */
width: 20rem;
height: 15rem;
background: royalblue;
}
div{
/* rem是根据自己盒子里面设置的字体大小算的,size*rem=px */
width: 10em;
height: 10em;
font-size: 25px;
background: skyblue;
}
/* PPI: */
/* DPR(设备像素比): 物理像素(设备显示)/逻辑像素(CSS设置)*/
</style>
rem+vw(可视口宽度)
<!--
640屏幕 iphone5 font-size:12px 100px=31.25vw rem=px/2/100
750屏幕 iphone6/7/8 font-size:16px 100px=26.67vw
--
<style>
html{
font-size: 20px;
}
section{
/* rem是根据html里面设置的字体大小算的,size*rem=px */
width: 20rem;
height: 15rem;
background: royalblue;
}
div{
/* rem是根据自己盒子里面设置的字体大小算的,size*rem=px */
width: 10em;
height: 10em;
font-size: 25px;
background: skyblue;
}
/* PPI: */
/* DPR(设备像素比): 物理像素(设备显示)/逻辑像素(CSS设置)*/
</style>
2021-08-04
最新推荐文章于 2024-08-14 22:24:56 发布
![](https://img-home.csdnimg.cn/images/20240711042549.png)