CSS display:block 到底是做什么的;对一个元素做什么?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/633827/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
What exactly does display:block; do to an element?
提问by Sam152
What are the exact specs of display:block? I know quite a few of the specific things applying this to an element will do but I would like to hear them all.
display:block 的具体规格是什么?我知道将这个应用于元素的很多具体事情都会做,但我想听听他们的全部。
Thanks.
谢谢。
采纳答案by ólafur Waage
In a block formatting context, boxes are laid out one after the other, vertically, beginning at the top of a containing block. The vertical distance between two sibling boxes is determined by the 'margin' properties. Vertical margins between adjacent block boxes in a block formatting context collapse.
In a block formatting context, each box's left outer edge touches the left edge of the containing block (for right-to-left formatting, right edges touch). This is true even in the presence of floats (although a box's content area may shrink due to the floats).
在块格式化上下文中,框从包含块的顶部开始一个接一个地垂直排列。两个兄弟框之间的垂直距离由“边距”属性决定。块格式上下文中相邻块框之间的垂直边距折叠。
在块格式上下文中,每个框的左外边缘接触包含块的左边缘(对于从右到左的格式,右边缘接触)。即使存在浮动也是如此(尽管盒子的内容区域可能会因浮动而缩小)。