各种css常用单位：
<html>
<head>
<meta charset="UTF-8">
<title>单位</title>
<style>
body{
font-size: 30px;
}
p{
/*缩进2个字符*/
text-indent: 2em;
/*font-variant 小型大写字母 中文没有作用 也不用它*/
/*font-variant: small-caps;*/
/*text-transform 属性控制文本的大小写 */
/*text-transform: capitalize;*/
}
hr{
border: 3px solid red;
}
hr:nth-child(1){
width: 5px;
}
hr:nth-child(2){
width: 5mm;
/*打印时使用*/
}
hr:nth-child(3){
width: 5cm;
}
hr:nth-child(4){
width: 5in;
/*英寸 1英寸等于2.54cm 打印时使用*/
}
hr:nth-child(5){
width: 5pt;
/*磅 1/72英寸 打印时使用 表示文字大小 印刷专业用的单位*/
}
hr:nth-child(6){
width: 5%;
/*适配多种尺寸的屏幕时常用*/
}
hr:nth-child(7){
width: 5em;
/*1em 当前字体的一个字符的大小
适配多种尺寸的屏幕时常用
更常用的是 rem
因为em是相对于容器的 会继承的
rem是相对于html的根元素*/
}
hr:nth-child(8){
width: 5ex;
/*当前字体中x字母的大小
中文环境下基本不用*/
}
</style>
<body>
<!--<p>这两天真热 hot HOT</p>-->
<hr>
<hr>
<hr>
<hr>
<hr>
<hr>
<hr>
<hr>
</body>
</html>