我无法相信我网站上发生的事情.当我添加这一行时:
<html xmlns="http://www.w3.org/1999/xhtml">
<!DOCTYPE html>
<html>
<head>
Run Code Online (Sandbox Code Playgroud)
一切正常.当我不这样做时,CSS"混乱",一切都变得不同,布局变得"丑陋".
这条线如何解决所有问题?!
Ric*_*uen 82
通常,<!DOCTYPE>
声明用于区分HTMLish语言的版本(在本例中为HTML或XHTML).
不同的标记语言将表现不同.我最喜欢的例子是height:100%
.在浏览器中查看以下内容:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<style type="text/css">
table { height:100%;background:yellow; }
</style>
</head>
<body>
<table>
<tbody>
<tr><td>How tall is this?</td></tr>
</tbody>
</table>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
......并将其与以下内容进行比较:(注意明显缺乏<!DOCTYPE>
声明)
<html>
<head>
<style type="text/css">
table { height:100%;background:yellow; }
</style>
</head>
<body>
<table>
<tbody>
<tr><td>How tall is this?</td></tr>
</tbody>
</table>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
您会注意到表格的高度差别很大,而且两个文档之间的唯一区别就是标记的类型!
<html xmlns="http://www.w3.org/1999/xhtml">
做什么了?但这并不能回答你的问题.从技术上讲,该xmlns
属性由XHTML文档的根元素使用:(根据Wikipedia)
XHTML文档的根元素必须是
html
,并且必须包含将xmlns
其与XHTML命名空间相关联的属性.
你知道,重要的是要理解XHTML不是HTML而是XML - 一种非常不同的生物.(好吧,一种不同的生物)xmlns
属性只是文档需要有效的XML之一.为什么?因为有人在标准工作这么说;)(你可以阅读更多关于维基百科XML命名空间,但我忽略这些信息"因为它不是你的问题实际上是相关的)!
<html xmlns="http://www.w3.org/1999/xhtml">
修复CSS呢?如果像这样构建你的文档...(正如你在评论中建议的那样)
<html xmlns="http://www.w3.org/1999/xhtml">
<!DOCTYPE html>
<html>
<head>
[...]
Run Code Online (Sandbox Code Playgroud)
......是固定的文档,它使我相信,你不知道很多关于CSS和HTML(没有犯罪!)那,而且事实是,没有 <html xmlns="http://www.w3.org/1999/xhtml">
它的运作正常,并与 <html xmlns="http://www.w3.org/1999/xhtml">
它不是-你只是觉得它是的,因为你习惯于编写无效的HTML,因此在怪癖模式下工作.
我提供的上述示例是同一问题的一个例子; 大多数人认为height:100%
应该导致<table>
整个窗口的高度,并且DOCTYPE
实际上是在破坏他们的CSS ...但事实并非如此; 相反,他们只是不明白他们需要添加html, body { height:100%; }
CSS规则来实现他们想要的效果.
ter*_*ško 23
它是一个XML命名空间.当您使用XHTML 1.0或1.1 doctypes或application/xhtml + xml mimetypes时,它是必需的.
你应该使用HTML5 doctype,然后你不需要它用于text/html.最好从这样的模板开始:
<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8 />
<title>domcument title</title>
<link rel="stylesheet" href="/stylesheet.css" type="text/css" />
</head>
<body>
<!-- your html content -->
<script src="/script.js"></script>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
当您直接放置Doctype时 - 执行并验证您的HTML和您的CSS.
这通常会让你解决布局问题.
听起来你的网站有CSS或JS依赖于在怪癖模式下运行.这就是为什么你需要在你的doctype之上的垃圾来"正确"渲染.我建议删除所说的垃圾,然后修复你的CSS + JS实际上在标准模式下工作; 从长远来看,你会为自己省去很多痛苦.
归档时间: |
|
查看次数: |
155029 次 |
最近记录: |