"传播到视口的含义是什么?#34;在CSS规范?

时间:2017-01-27 02:37:16

标签: css specifications

CSS规范中有一些章节提到"传播到视口&#34 ;;例如:calculating the height

  

当溢出时,本节也适用于正常流程中的块级非替换元素。没有计算到可见的'但已传播到视口。

什么样的属性可以传播?它是否与子元素从其父元素继承属性的规则相矛盾?

1 个答案:

答案 0 :(得分:7)

正如引用所述,overflow property能够从body传播到html,从html传播到视口:

  

UA必须将根元素上设置的'overflow'属性应用于视口。当根元素是HTML“HTML”元素或XHTML“html”元素,并且该元素具有HTML“BODY”元素或XHTML“body”元素作为子元素时,用户代理必须改为应用“溢出”属性从第一个这样的子元素到视口,如果根元素上的值是“可见的”。用于视口时的“可见”值必须解释为“自动”。传播值的元素必须具有'visible'的'溢出'的使用值。

可以这种方式传播的另一个属性是background

  

由于没有元素对应于画布,为了允许画布的样式,CSS传播根元素的背景(或者,在HTML的情况下,传播< body>元素),如下所述。

  

3.11.1。画布背景和根元素

     

根元素的背景成为画布的背景,其背景绘画区域扩展到覆盖整个画布。但是,任何图像的大小和位置都相对于根元素,就像它们仅为该元素绘制一样。 (换句话说,背景定位区域是根元素确定的。)根元素不会再次绘制此背景,即其背景的使用值是透明的。

     

3.11.2。画布背景和HTML< body>元件

     

对于其根元素为HTML HTML元素[HTML401]或XHTML html元素[XHTML11]的文档:如果根元素上的'background-image'的计算值为'none '及其'background-color'是'透明',用户代理必须从该元素的第一个HTML BODY或XHTML body子元素传播背景属性的计算值。 BODY元素的背景属性的使用值是它们的初始值,传播的值被视为在根元素上指定它们。建议HTML文档的作者指定BODY元素的画布背景而不是HTML元素。

此传播行为是出于历史原因(<body background="..." bgcolor="...">)指定的,也是为了使作者能够设置整个页面背景的样式,这通常不能仅通过html或{{1}来完成}元素没有先删除它们的默认边距和forcing them to fill the page

surprisedresults可能comparing the behavior with other elements可能interesting workarounds for browser bugs dating back over 15 years https://jsfiddle.net/nt0vhtmg/20/ {}} {}} {}> {} 。另一方面,作者也利用这种行为来创建{{3}}。

此行为与继承不冲突,因为它的工作方向相反。继承将属性值从父元素“传播”到子元素;此行为将属性值从子框传播到父框(bodybody,并html分别传播到视口。“