gpt4 book ai didi

html - 宽度小于其背景

转载 作者:太空狗 更新时间:2023-10-29 13:14:01 25 4
gpt4 key购买 nike

我在 <html> 上设置了样式:

html {
background: #ECECEC;
border: 1px solid #FFFFFF;
}

如果页面内容比页面宽,为什么边框停止了,背景却一直在继续?

这是一个显示问题的 fiddle :http://jsfiddle.net/rPGyc/3

最佳答案

html 是一个合适的 block 级元素,就像 bodypdiv 等 —因此,它遵守与其他 block 元素相同的所有溢出规则。

但是,当内容超出其宽度(或当其宽度小于浏览器窗口或视口(viewport)的 100%)时,html 的背景会溢出其边框的原因是背景颜色传播到视口(viewport),它是包含 html 及其所有呈现内容的 Canvas 。但是,边框仍然是 html 元素的一部分,因此当内容溢出时该元素不会展开。此行为与如何将背景应用于 body 而不是 html 导致 body 背景传播到根元素非常相似,如 this answer 中所述。其中引用了this section of the spec .

作为Alohci notes in a comment在答案下,关于视口(viewport),这同样适用于 html:

Note that html behaves with respect to the viewport in much the same way as body behaves with respect to html, with the background escaping beyond the confines of the html element. See http://jsfiddle.net/GmAL4/4/ to see what I mean.

关于html - <html> 宽度小于其背景,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/11083984/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com