gpt4 book ai didi

html - 如果使用 DOCTYPE,则 Css 样式应用不正确

转载 作者:技术小花猫 更新时间:2023-10-29 12:45:54 26 4
gpt4 key购买 nike

我的HTML代码(没有DOCTYPE也能正常显示):

<html> 
<head>
<title>Test</title>
</head>
<body style="background-color:green;height:100%;width:100%;">
<div>My Test page</div>
<div style="background-color:red;height:100%;width:10%;"></div>
</body>
</html>

我的 HTML 代码(红色背景颜色未应用 DOCTYPE):

<!DOCTYPE html>
<html>
<head>
<title>Test</title>
</head>
<body style="background-color:green;height:100%;width:100%;">
<div>My Test page</div>
<div style="background-color:red;height:100%;width:10%;"></div>
</body>
</html>

此外,我尝试使用 XHTML 1.0 strict 而不是 HTML5,

 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

和,

  <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">

但没有一个能正常工作。如何正确添加版本。

2) 还有现在最好的版本。 HTML5 或 html4.01 或带有 XHTML 的 HTML 4.01?

最佳答案

缺少文档类型触发器 quirks mode ,这只是为了向后兼容在人们开始使用文档类型之前创建的“遗留代码”。它几乎不应该被使用;你应该总是声明一个文档类型。

选择哪一个?

在这个时代,这就是您所需要的:

<!DOCTYPE html>

如果您愿意,您可以继续使用此文档类型的 XHTML 语法。就 CSS 而言,我所知道的不同文档类型没有任何区别,只要你有一个。然而,文档类型将改变哪些属性和元素是有效的以及在哪些上下文中有效。使用 W3C Validator测试您的 HTML。

不幸的是,这意味着您将重写大部分 CSS 以在标准模式下工作。我知道这听起来像是一件苦差事,但您必须硬着头皮重写它。

前进的重要注意事项:删除内联 CSS 并改用外部样式表,否则(除其他事项外)您会发现维护完全是一场噩梦。

感兴趣的:http://hsivonen.iki.fi/doctype/#choosing

Choosing a Doctype

text/html

In a nutshell: Here are simple guidelines for choosing a doctype for a new text/html document:

Standards mode, cutting edge validation

<!DOCTYPE html>

This is the right thing to do unless you have a specific reason to avoid it. With this doctype, you can validate new features such as <video>, <canvas> and ARIA. Please be sure to test your page in the latest versions of the top browsers. Standards mode, legacy validation target

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

This doctype also triggers the standards mode, but lets you stick to legacy validation in case you want to avoid new features or more precise validation of old features. You’d like to use the Standards mode, but you use sliced images in table layouts and don’t want to fix them

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

This gives you the Almost Standards mode. Please note that your layouts based on sliced images in tables are likely to break if you later move to HTML5 (and, hence, the full Standards mode). You willfully want the Quirks mode

No doctype.

Please don’t do this. Willfully designing for the Quirks mode will come and haunt you, your coworkers or your successors in the future—when no one even cares about Windows IE 6 anymore (already no one cares about Netscape 4.x and IE 5). Designing for the Quirks mode is a bad idea. Trust me.

If you still want to support Windows IE 6, it is better to apply specific hacks for it using conditional comments than to regress other browsers into the Quirks mode.

I am not recommending any of the XHTML doctypes, because serving XHTML as text/html is considered harmful. If you choose to use an XHTML doctype anyway, please note that the XML declaration makes IE 6 (but not IE 7!) trigger the Quirks mode.

关于html - 如果使用 DOCTYPE,则 Css 样式应用不正确,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/10380346/

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