css 单位-px、em、rem、百分比

时间:2024-11-22 10:33:14


  • px像素(Pixel,像素px是相对于显示器屏幕分辨率而言的。
  • em是相对长度单位。相对于当前对象内文本的字体尺寸。如当前对行内文本的字体尺寸未被人为设置,则相对于父级元素字体尺寸(若父级元素未指定font-size,则一层一层的往上找;若找不到,则相对于浏览器的默认字体尺寸)。
    对应的html代码   <div><p></p></div>
    若设置样式 div{font-size:16px;} p{font-size:1em},那么p元素的font-size为16px。
  • rem是CSS3新增的一个相对单位(root em),根em。 使用rem为元素设定字体大小时,仍然是相对大小,但相对的只是HTML根元素。

    可以设置html,body{font-size=62.5%},那么1rem=10px,方便使用。

  • %百分比,是相对于父元素的比列。

    我们在设置width的时候,经常会用到%。如{width:90%;margin:0 auto}