zoukankan      html  css  js  c++  java
  • px、pt、em、rem 的区别

    px(pixel)

    像素,是屏幕上显示数据的最基本的点,表示相对大小(不同分辨率上px显示不同)

    pt(point)

    印刷行业常用的单位(磅),等于1/72英寸,表示绝对长度

    em

    em是相对长度单位,基于父级元素的font-size计算字体大小。

    如果未设置父级字体大小,则相对浏览器默认字体尺寸16px(1em = 16px):10px=0.625em,

    为了简化换算,在css中的body选择器中声明Font-size=62.5%,这就使em值变为 16px*62.5%=10px, 10px=1em

    如果设置了父级元素的font-size:

    <body style="font-size:14px">
    
        <p style="font-size:2em">我这里的字体显示大小是28px(14px*2)</p>  
    
        <div style="font-size:18px">
    
            <p style="font-size:2em">我这里显示字体大小是36px(18px*2),而不是上面计算的28px</p>
    
        </div>
    
    </body>

    rem (root em)

    与em的区别在于,它是相对于html根元素的。(在body标签里面设置字体大小不起作用)

    既可以做到只修改根元素就成比例地调整所有字体大小,又可以避免字体大小逐层复合的连锁反应

     <body style="font-size:14px">
    
         <p style="font-size:2rem">我这里的字体显示大小是32px(16px*2),因为我是根据html根元素的font-size大小进行计算的</p>  
    
         <div style="font-size:18px">
    
             <p style="font-size:2rem">我这里显示字体大小是32px(16px*2),因为我是根据html根元素的font-size大小进行计算的</p>
    
         </div>
    
     </body>

     参考:pt,px,rem和em之间区别总结

  • 相关阅读:
    parser_url
    fsockopen
    MySql支持的数据类型
    MySql常用字符集
    MySQL各大存储引擎
    MySql数据库基础
    Python 流程控制 超全解析(不可错过)
    python 序列解包(解压缩)
    python常量 (最全常量解析)
    python内存管理(通俗易懂,详细可靠)
  • 原文地址:https://www.cnblogs.com/wx1993/p/8417258.html
Copyright © 2011-2022 走看看