资讯专栏INFORMATION COLUMN

css 各单位距离比较

Rainie / 3101人阅读

摘要:单位若自身没有设置字体大小,依据父元素,若设置则计算为不仅仅是等都可用距离百分比按照父元素的宽度计算负值相对父元素规范对重叠有如下的描述水平边距永远不会重合垂直边距可能在特定的框之间重合百分比按照父元素的宽度计算无负值参考链接

单位 em

    若自身没有设置字体大小,依据父元素,若设置则计算为font-size*em

rem

   html { font-size: 10px;}

   body{ font-size: 1rem;} //font-size: 10px;

   不仅仅是font-size,margin,padding等都可用

   html{font-size: 62.5%;} //font-size: 10px; 10/16100%
距离 margin

    百分比: 按照父元素的宽度计算
    负值:相对父元素
    

    css 2.0规范对margin重叠有如下的描述:
        1.水平边距永远不会重合
        2.垂直边距可能在特定的框之间重合
padding
    百分比: 按照父元素的宽度计算      
    **无负值**
        

参考链接:
https://www.cnblogs.com/mengf...
https://www.jianshu.com/p/6e4...

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/114416.html

相关文章

  • CSS魔法堂:重拾Border之——图片作边框

    摘要:一铺搞定一铺清袋粤语的一铺搞定其实就是一次完成全部工作的意思,上面关于的属性,要是每次都逐个设置那要敲多少次键盘啊。。。语法粤语的一铺清袋其实就是把之前的成果一次性归零。 前言  当CSS3推出border-radius属性时我们是那么欣喜若狂啊,一想到终于不用再添加额外元素来模拟圆角了,但发现border-radius还分水平半径和垂直半径,然后又发现border-top-left/...

    linkFly 评论0 收藏0
  • 【Hello CSS】第六章-文档流与排版

    摘要:作者陈大鱼头正常流什么是正常流其实就是我们日常所说的文档流。在官方文档里对应的是。然后,包含形成一条线的框的矩形区域称为线盒。基线线盒的高度由的计算结果决定。级层叠上下文被自动视为父级层叠上下文的一个独立单元。自由分配,由具体情况决定。 作者:陈大鱼头 github: KRISACHAN 正常流 什么是正常流?其实就是我们日常所说的文档流。在W3C官方文档里对应的是normal ...

    nihao 评论0 收藏0
  • 【Hello CSS】第六章-文档流与排版

    摘要:作者陈大鱼头正常流什么是正常流其实就是我们日常所说的文档流。在官方文档里对应的是。然后,包含形成一条线的框的矩形区域称为线盒。基线线盒的高度由的计算结果决定。级层叠上下文被自动视为父级层叠上下文的一个独立单元。自由分配,由具体情况决定。 作者:陈大鱼头 github: KRISACHAN 正常流 什么是正常流?其实就是我们日常所说的文档流。在W3C官方文档里对应的是normal ...

    null1145 评论0 收藏0
  • CSS3 border-image 彻底明白

    摘要:用于给边框贴上背景图像类似于中的背景属性。重复性取值为重复只是其中之一,其余两个是平铺和拉伸。其中,是默认值。例如表示水平方向平铺,垂直方向重复。不进行拉伸,不凑整。效果如下白框为部分资料来源网络亲们,看懂没不懂请留言,帮你解答。。 border-image用于给border(边框)贴上背景图像 类似于CSS中的background(背景)属性。 例如:background:url...

    chenjiang3 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<