css br的问题是什么?

时间:2011-01-08 22:57:08

标签: css

我偶然发现了这篇文章 http://www.thefloatingfrog.co.uk/css/my-hatred-of-br-clearall/

什么时候需要使用它? 为什么这是邪恶的? 我不明白替代语法可以解释一下吗?

5 个答案:

答案 0 :(得分:2)

我准备发布一些关于你不读这篇文章的讽刺,但当我看到它只是一页没有任何解释的尖刻的愤怒时,我想我会回答。

这是因为有更好的方法可以做你想做的事情 - 也就是说,通过他在文章中使用CSS的方式,他将他所展示的元素的语义与他显示它们的方式分开。为什么这是一个大问题?嗯,首先,他可以更容易地改变他的页面在不同平台(移动,桌面)和媒体(屏幕,打印,盲人屏幕阅读器)上显示时的外观,只需编辑CSS而不必触摸记录本身。 CSS的这个功能是纯金。

另一方面,如果您使用这样的结构,那么无论您正在处理什么媒体或平台,您都会对文档的演示文稿施加严格限制。是什么让他这么生气?因为一旦开发人员进入他面前并使用<br clear="all">,他必须将其拿出来以获得我刚才提到的好处。这就是为什么它如此令人沮丧。一个糟糕的开发人员可以为之后的其他开发人员禁用一大堆开发方案。

就CSS来说,我不得不说这是一个非常困难的主题,只是在没有阅读所有关于它是如何工作的情况下选择。如果您不理解floats,很难解释clear属性的工作原理。在我买了great book on the subject之前,我自己很难过。

答案 1 :(得分:2)

为两者设置clear,不允许其他元素浮动在元素的左侧或右侧。下面的类是一种在任何地方添加它的简单方法。

.clear {
    clear:both;
}

所以当你想要清除某些东西时(也就是说,如果你要将下一个元素浮动到左边,那么它将在当前元素下方和左边,而不是左边)你只需要添加.clear class。

以下代码的问题在于,如果您稍后决定不想在“某事”类之后清除所有内容,那么您必须浏览HTML并删除br clear =“all”你有'某事'类。

<div class="something">Cool content.</div>
<br clear="all">
<div class="other">Cool content again.</div>

相反,你可以这样做:

.something {
    float: left;
}
.other {
    clear :both;
    float: left;
}

<div class="something">Hi!</div>
<div class="other">Hi again from below!</div>

这样,如果您稍后决定使用“其他”类浮动所有块,那么您可以删除'clear:both;'来自CSS一次。

答案 2 :(得分:1)

这个想法是你的标记描述了信息,CSS格式化了这些信息。 清除浮动的虚拟标签不是语义,因为它的唯一目的是出于布局的原因。清除浮动还有其他语义方法可以保持这种分离。如下所述,但为了清楚起见,这是用于语义清除浮点数http://css-tricks.com/the-how-and-why-of-clearing-floats/

的良好资源

答案 3 :(得分:1)

当您浮动元素时,父元素无法有效地计算其尺寸并且尺寸不正确。跟随浮动物品的其他物品也可能不合适。通过清除浮动结束时的元素, correct 可以改变这种行为。

修改

实际上正确可能是错误的用词,因为这是应该发生的事情并使用正确的单词表示它已被破坏。

答案 4 :(得分:1)

作者正在疯狂地谈论如何在DIV元素本身上使用CSS完成同样的事情。他说br class =“clear”是不必要的。

这也不是一个好习惯,因为它将内容与演示文稿混合在一起。如果网页设计师想要重新设置Web应用程序的主题,他或她需要修改HTML以提取所有明确的元素,而如果这是按照作者的建议完成的,则CSS文件可以被换出独立于HTML,使他们的工作更容易,并给他们少一点咆哮和赞美。

咆哮当然是有道理的,因为这些简单,愚蠢的代码行实际上会引起很多麻烦。