css 如果我添加overflow-x,为什么body溢出属性被忽略:隐藏到html标签中?

gr8qqesn  于 2022-11-19  发布在  其他
关注(0)|答案(2)|浏览(207)

我有一个问题与身体溢出被忽视和发挥周围我发现它发生,因为有人这样做:

html{
overflow-x: hidden;
}

我从来不会这样做,因为直接对html元素进行样式化对我来说就像是一种拯救行为。但是既然有人这样做了,我想了解这种情况:
第一次
运行时注意正文溢出正常,隐藏则忽略。
当然,如果我从html选择器中删除了overflow属性,它就会按预期工作。

bvpmtnay

bvpmtnay1#

如本W3文档中关于溢出的说明:
UA必须将根元素上设置的“overflow”属性应用于视口。当根元素是HTML“HTML”元素或XHTML“html”元素,并且该元素具有HTML“BODY”元素或XHTML“body”元素作为子元素时,如果根元素上的值为“visible”,则用户代理必须将第一个此类子元素的“overflow”属性应用于视口。
所以,长话短说,我认为当HTML元素溢出时,不可能使body overflow属性起作用,因为这不是css属性的正确用法。

bmvo0sr5

bmvo0sr52#

body元素内部没有溢出,因为它的高度是由内容定义的。如果你想让overflow: hidden工作,你需要固定一个高度,这个高度需要小于屏幕(视区)的高度,这样就不会触发视区的溢出。
第一个
删除overflow-x: hidden时,您将面临另一种情况,即主体的溢出将传播到根元素,然后传播到视口。主体内的内容仍然没有溢出,但整个主体正在溢出,并且由于传播,该溢出被隐藏。

相关问题