块级框和主体块级框之间有什么区别？ [英] What's the difference between a block-level box and a principal block-level box?

问题描述

引用规范：

块级框是参与块格式化
上下文的框。每个块级别元素生成包含后代框和生成内容的主要块级别
框，并且也是
任何定位方案中涉及的框。一些块级元素
可以生成除主框之外的附加框：
'list-item'elements。

Block-level boxes are boxes that participate in a block formatting context. Each block-level element generates a principal block-level box that contains descendant boxes and generated content and is also the box involved in any positioning scheme. Some block-level elements may generate additional boxes in addition to the principal box: 'list-item' elements. These additional boxes are placed with respect to the principal box.

它们本质上是否相同？

推荐答案

主体块级框是由给定元素生成的块级框，它直接受应用于元素的样式规则的影响。

A principal block-level box is the block-level box generated by a given element that's directly affected by style rules that apply to the element.

大多数元素只生成一个框。对于这些元素，它们是基本上相同的，因为没有涉及其他框。

Most elements generate only one box. For these elements, they are essentially the same thing, since there are no other boxes involved.

但是，元素可以生成多个框，具体取决于其显示类型，例如列表项;当为这样的元素声明样式时，样式通常应用于主盒，并且生成的任何其他框将相应地呈现。

However, an element can generate more than one box depending on its display type, such as a list item; when you declare styles for such an element, the styles are typically applied to the principal box and any additional boxes that are generated will be rendered accordingly.

例如，列表项目除了主框之外还有一个标记框;如果指定 list-style-position：outside ，则列表标记将放在主框的边界之外，但主框的背景和边框不会受影响。请注意，标记框仍然是主框的后代，因此 color 的可继承属性将应用于标记（这是为什么 color：

For example, a list item has a marker box in addition to the principal box; if you specify list-style-position: outside, the list marker will be placed outside the boundaries of the principal box but the background and borders of the principal box won't be affected. Note that the marker box is still a descendant of the principal box, so inheritable properties such as color will apply to the marker (this is why color: red turns both the text and its bullet marker red).

大多数其他块级元素，包括显示：块 ，但不包括 display：table （请参阅 section 17.4 ）将简单地为它们的内容生成一个主体块框，而不是其他东西，使它们基本上只是块框那些元素。

Most other block-level elements, including display: block but excluding display: table (see section 17.4), will simply generate a principal block box for their content and nothing else, making them essentially just "block boxes", but only for those elements.

换句话说，所有主要块级框都是块级框，但不是所有的框级框都是主体，例如匿名块框。此外，内联元素（包括内联块）不会自己生成任何主体框，也不会有主体内联框。

In other words, all principal block-level boxes are block-level boxes, but not all block-level boxes are principal, for example anonymous block boxes. Also, inline elements, including inline blocks, do not generate any principal boxes themselves, nor is there such a thing as a principal inline box.

这篇关于块级框和主体块级框之间有什么区别？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！