• CSS长度单位


    绝对长度单位

    像素px(pixels)

    计算机屏幕上的一个点(1px = 1/96th of 1in),在web上,像素px是典型的度量单位,很多其他长度单位直接映射成像素


    英寸in(inches)

    1in = 2.54cm = 96px


    厘米cm(centimeters)

    1cm = 10mm = 96px/2.54 = 37.8px


    毫米mm(millimeters)

    1mm = 0.1cm = 3.78px


    1/4毫米q(quarter-millimeters)

    1q = 1/4mm = 0.945px


    点pt(points)

    1pt = 1/72in = =0.0139in = 1/72*2.54cm = 1/72*96px = 1.33px


    派卡pc(picas)

    1pc = 12pt = 1/6in = 1/6*96px = 16px

     

    字体相关相对长度单位

    em

    表示元素的font-size属性的计算值,如果用于font-size属性本身,相对于父元素的font-size;若用于其他属性,相对于本身元素的font-size。即描述相对于应用在当前元素的字体尺寸,所以它也是相对长度单位。在CSS中,em是非常有用的单位,因为它可以自动适应用户所使用的字体。

    1em 等于当前的字体尺寸。
    2em 等于当前字体尺寸的两倍。
    一般浏览器字体大小默认为16px,则2em == 32px;
    例如,如果某元素以12pt显示,那么2em是24pt


    ex

    指所用字体中小写x的高度。但不同字体x的高度可能不同。实际上,很多浏览器取em值一半作为ex值,
    ex在实际中常用于微调


    rem

    相对于根元素html的font-size属性的计算值


    ch

    与ex类似,被定义为数字0的宽度。当无法确定数字0宽度时,取em值的一半作为ch值,ch在实际中主要用于盲文排版

     

    视口相关相对长度单位

    vh

    viewpoint height,视窗高度,1vh=视窗高度的1%


    vw

    viewpoint width,视窗宽度,1vw=视窗宽度的1%


    vmin

    vw和vh中较小的那个


    vmax

    vw和vh中较大的那个

  • 相关阅读:
    人生如此
    微软十七道智力面试题及答案
    【Flink系列十】Flink作业提交过程的调试和诊断
    【Flink系列九】Flink 作业提交遇到的问题记录以及原理
    Jackson ObjectMapper JSON序列化工具使用笔记,由浅入深
    既有设计模式的lambda重构
    观察者模式/Observer
    函数式接口java.util.function
    面向对象世界的七个设计原则
    重构-改善既有代码设计读后灵光
  • 原文地址:https://www.cnblogs.com/xiaohu12138/p/9777540.html
Copyright © 2020-2023  润新知