元素层次结构

重要的是要了解如何元素表现在Webflow。这里我们将讨论元素层次结构在三个方面:

• 嵌套——如何彼此嵌套对象(如父母、孩子、兄弟姐妹)
• 继承了文本样式——文本样式是如何从父母传给孩子
• 大小的关系——父元素和子元素的大小如何影响另一个

嵌套

嵌套是将一个物体在另一个物体。例如,如果一个标题被放置在一个部分,该标题已经内嵌套的部分。读到这个盒子模型。

嵌套在Navigator视图

嵌套是最容易看到的导航器面板。

一旦内嵌套的部分,标题是一个部分的子元素。其他元素添加部分元素的子元素,。他们也彼此的兄弟姐妹。

———顶级元素的层次开始的所有网站。直属,其所有的子元素都是略缩进。水平缩进表示元素是儿童。元素在这个层面上,他们的父元素是人体。

身体内的部分内容内嵌套元素的父元素。内容是缩进更表明,这些元素是儿童的部分。

在导航栏中查看嵌套

第二个地方,我们可以看到下面层次结构帆布面包屑栏。您可以选择任何元素快速确定它与它的父元素的关系。然而,它不会显示兄弟元素,只有直接母公司,元素的直接父,等等。

继承了文本样式

当一个元素排版样式,这些样式是传递给它的孩子和孙子元素。例如,如果您编辑字体Body元素,它的所有子元素将继承相同的字体。孩子们可以覆盖风格继承了父母和祖父母。例如,如果您选择一个部分和编辑字体,所有的孩子将继承相同的字体。然而,如果你选择一个子元素和编辑字体的家庭,它会覆盖字体家族继承自父节。了解更多关于文本样式继承。

样式面板提供了一个简单的方法来确定哪些风格被继承,和他们被继承。橙色标签和图标表明,风格是继承自一个父元素或更高的类或标签。

大小的关系

大多数元素大小的内容。例如,部分默认情况下没有定义的高度。然而,添加元素内部分将使部分较高。

虽然孩子们影响大小的父元素,给父元素一组高度或宽度将会覆盖。意义,内容不会影响父母的高度包装器(部分,容器div . .)了。当有更多的内容包装,将溢出的内容包装。学习如何隐藏溢出并添加滚动条fixed-height包装器。