基本视觉格式化

非替换元素:如果元素的内容包含在文档中,则称之为非替换元素。例如,如果一个段落的文本内容都放在该元素的本事之内,这个段落就是一个非替换元素。

替换元素:这是指用作为其他内容占位符的一个元素。经典例子是img元素。

盒子模型–关于width/height设置
《基本视觉格式化》W3C标准,也就是,width不包含padding及border、margin,块级元素实际占用的宽度=width+padding+border。

水平格式化(非替换元素)
一个简单的规则,正常流中块级元素框的水平部分总和等于父元素的width(里面元素的width+padding+border+margin=父的width)

水平元素的“7大属性”:margin-left/right、border-left/right、padding-left/right、width。7大属性加起来必须是元素包含块的width。其中只有3个属性可设置为auto:width、margin-left/right。

    原文作者:dandelion_zhu
    原文地址: https://segmentfault.com/a/1190000010942966
    本文转自网络文章,转载此文章仅为分享知识,如有侵权,请联系博主进行删除。
点赞