css常用单位
px
像素 是屏幕上显示数据的最基本的点 用域网页设计 直观方便
像素是相对五显示器屏幕分辨率而言的
比如
windows的用户所使用的分辨率一般是96像素/英寸 而Mac的用户说使用的分辨率一般是72像素/英寸
pt 点是印刷行业常用的单位 1pt=1/72英寸 绝对单位
pc 派卡 绝对单位
in 英寸 绝对单位
mm 毫米 绝对单位
cm 厘米 绝对单位
换算关系
1in=2.54cm=25.4mm=72pt=6pc159
s 秒
ms 毫秒
1s=1000ms
deg 角度
tum 圈
1tum=360deg
em 字符单位 相对于其本身字体大小来讲
rem 相对与根元素html来讲
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <meta http-equiv="X-UA-Compatible" content="IE=edge"> 6 <meta name="viewport" content="width=device-width, initial-scale=1.0"> 7 <title>css常用单位</title> 8 <style> 9 *{ 10 margin: 0; 11 padding: 0; 12 } 13 p:nth-of-type(2){ 14 /* 首行缩进32个像素 */ 15 text-indent:32px; 16 } 17 p:nth-of-type(3){ 18 /* 首行缩进两个字符 19 相对于自己本身字体大小进行设置, 20 如果没有 则继承父元素的字体大小 21 chrome 默认16px 22 2em:2*16=32px; 23 */ 24 text-indent:2em; 25 } 26 p:nth-of-type(4){ 27 /* 相对于根元素字体大小而言 ,根原始字体大小浏览器chrome默认16px ,2rem=2*16px; */ 28 text-indent:2rem; 29 } 30 </style> 31 </head> 32 <body> 33 <p>默认没有设置缩进的文本</p> 34 <p>设置首行缩进32个像素</p> 35 <p>设置首行缩进两个字符,字符单位em,相对于自己本身字体大小而言</p> 36 <p>首行缩进2rem,rem单位相对的是根元html字体大小而言，不受自己本身字体大小的影响</p> 37 </body> 38 </html>
