gpt4 book ai didi

html - doctype对css的影响

转载 作者:可可西里 更新时间:2023-11-01 12:52:33 28 4
gpt4 key购买 nike

当我这样做

<html>
<head>
</head>
<body>
<div style="width:100%;height:100%;background:blue;"></div>
</body>
</html>

div 填充窗口

但是如果我在开头添加一个doctype标签

<!DOCTYPE HTML>
<html>
<head>
</head>
<body>
<div style="width:100%;height:100%;background:blue;"></div>
</body>
</html>

div 填充宽度,但不填充高度。

知道发生了什么事吗?我知道我应该放置文档类型标签,我只是想知道它在这种情况下的具体作用会导致不同的行为。

最佳答案

缺少 doctype 声明会触发“怪癖模式”,这意味着浏览器会做不同的事情来处理文档,假设它是可能依赖于旧浏览器中存在的功能的遗留代码。粗略地说,“怪癖模式”意味着浏览器试图或多或少地表现得像 Internet Explorer 4。但它们以不同的方式做到这一点;我编写了一个不完整的列表 what happens in “quirks mode.” “Quirks 模式”应该只用于需要它的遗留页面;相反,在“怪异模式”下工作的页面在“标准模式”下可能会崩溃,而您只需添加文档类型声明即可到达那里。

在您的例子中,在这里跳过理论部分,您需要添加一些规则以使 div 元素以“标准模式”填充 Canvas :

<style>
head, body { height: 100%; margin: 0; padding: 0;}
</style>

<div style="width:100%;height:100%;background:blue; position: absolute;"></div>

关于html - doctype对css的影响,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/8623068/

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