陶然成,其中在母版页页脚没有为一个特定的网页无法正确显示我的网页上的问题。 在该页面中,我有一个
<div style="clear:both" />
在底部。
它撞我的头一段时间后,我看到了所有我需要改变,以获得页脚,以显示正确是改变该行:
<div style="clear:both"></div>
我不明白为什么这样应该产生不同的结果写它。 他们不是语义上等同? 我检查和双重检查,这是我做出的唯一改变。 来回翻转两者之间会改变页脚的行为。
所以我的问题是...是那些不等同? 什么是它们之间的区别?
编辑:奇数部分是,他们都做什么,我想在网页上面他们的东西。 我的意思是,在自闭div标签的情况下,如果我完全删除它的页面一定反应,所以它必须做它的东西,不只是忽略它完全。
<div />
不是一个有效的标记。 的自闭标签是不允许的。
您需要使用完整版本<div></div>
自封闭div标签将毫无意义,因为这将导致空div。 一个空的div通常不被大多数浏览器的渲染。
根据HTML 4.01规范 ,第7.5.4节(“分组元素: DIV
和SPAN
元素):
开始标记: 需要 ,结束标记: 需要
因此,一个自闭合<div>
标签(如所指定的第一个例子: <div />
是无效的 。
如果我没记错的话- <div />
是无效的。 使用<div></div>
如果你想让它在各处都起作用。 结束标记是必需的,所以做这样的事情<div class="Clear" />
将无法正常工作。
所有分组元素的行为方式相同。 你会看到与两个DIV和SPAN相同的行为。
编辑:发现这个链接 ,同时看着张贴@Donut答案的链接-它是一个矩阵,显示哪些元素有一个可选的结束标记要求看着有趣,所以我想我会在这里发布它(除其他事项外)。和大家一起分享其他人也是如此。
这取决于你使用的DOCTYPE。
对于XHTML ,这是XML,这两个标签是等价的。 您将通过包括以下文档类型为你的页面的第一行的一个信号,这个浏览器:
<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
对于HTML 4.01 ,这是所有(?)浏览器假设时,有没有DOCTYPE,某些标记必须表示为开闭。 大多数块级标签的要求这一点,包括这样的非标记标签作为<SCRIPT>
如果你看一下WDG HTML文档 ,你会看到一个特定的标签是否需要开闭,也可以表示为一个空的标签,通过“语法”项目:
Syntax <DIV>...</DIV>
自终止标签在XML有效的,但不是在这种情况下HTML
第一个选项是无效的HTML; 第二个是。 <div />
真是混淆了IE浏览器,所以总是去<div><div/>
<div />
取决于您是有效的DOCTYPE
它是有效的XHTML过渡及严格的XHTML
DEMO: http://wecodesign.com/demos/stackoverflow-1411182.htm
验证 : http://validator.w3.org/check?uri=http%3A%2F%2Fwecodesign.com%2Fdemos%2Fstackoverflow-1411182.htm&charset=%28detect+automatically%29&doctype=Inline&group=0
如果你想使用一个标签,而不是有一个无用的空<div>
页面上,请尝试使用<br />
你就消失了。
<style type="text/css">
.clear-fix {
float: none !important;
height: 0 !important;
overflow: hidden !important;
clear: both !important;
display: block !important;
line-height: 0 !important;
font-size: 0 !important;
}
</style>
<br class="clear-fix" />
有些人可能会质疑我的使用!important
在这里; 然而,这就是为什么它存在的理由! 我们知道,当我们清除的东西,我们希望它做一个特定的任务不管是什么 。
举个例子:
<style type="text/css">
.hidden {display: none;}
#foo {display: block;}
</style>
<p id="foo" class="hidden">You can still see me</p>
在这种特殊情况下,你会增加!important
到你的隐藏的类,因为它是很清楚,它应该隐藏的东西不管是什么