嵌入式CSS黑客与单独的级联样式表

时间:2009-06-05 23:10:01

标签: html css

我认为这不是流行的立场,但我更喜欢样式表中的嵌入式黑客,如*和_,而不是使用单独的IE特定样式表。起初我尝试了单独的样式表,但我发现让相同元素的样式跨越多个文件的范围很难维护。在主样式表中更改样式时,我在IE特定样式表中也有相应的样式,这一点并不明显。通常这些样式的时间变化很小,例如对填充的微小调整,以及在每个浏览器中测试它的额外时间似乎过多,因此并不总是发生。

如果hack只是直接包含在主样式表中,那么显然IE 6的样式也需要进行调整和测试。我可以听到有人说你应该在所有支持的浏览器中测试每种风格的变化,但在现实世界中,我发现这种立场是不现实的,而且我没有看到团队中的所有开发人员都在使用它。

据我所知,包含黑客攻击会使您的CSS无法验证,但我发现我可以快速扫描验证结果并忽略有关这些黑客的错误。在我看来,我更愿意解释验证结果,而不是处理在IE 6中错误渲染的网站。我还读过其他地方,人们不会做黑客或单独的样式表,而是调整/简化设计所以它适用于所有浏览器。不幸的是,实施该设计的开发人员在不负责设计时并不总是有这个选项。此外,我努力在所有浏览器中使用少量填充问题以避免黑客攻击看起来非常浪费。

我对他们对这种范式的立场的想法和理由感兴趣。

5 个答案:

答案 0 :(得分:1)

好吧,我有点陷入同一条船......如果我可以放入一个* html #id而不是做一个完整的条件评论和特定的ie6样式表,我会这样做。它可能不是那么优雅,但它会为maintan保存一个全新的CSS文件。

但是,如果我最终拥有大量* html*前缀,或者超长IE7黑客(我现在无法回想起),我会更喜欢条件样式表。

我真的没有看到* html是一个真正的黑客...它是一个有效的选择器(据我所知),它只是不应该工作,因为没有HTML的父元素(除了IE6中的某些原因)。但是,使用下划线或特定字符为属性添加前缀会使 selector 属性无效。

另一个我不介意的是在IE6中使用display: inline来修复元素浮动时的双边距。我在我的主CSS中使用它,因为它不会影响其他浏览器(只有块级元素可以浮动),并且它更容易维护。我通常会留下一些注释,比如

#my-div {
    diplay: inline; /* ie6 */
    float: left;
    margin-left: 20px;
}

所以我会说如果它是几个黑客,我把它放在我的主要CSS中。如果它变得笨拙(并且它通常不是我知道IE失败的常见方式),我将创建一个额外的样式表并使用条件注释。

答案 1 :(得分:1)

我已经完成了一些CSS的广泛工作,几乎每个浏览器都在阳光下,适用于小型项目和大型项目。虽然对于您可能编写的任何类型的代码总是具有极大的吸引力,但我认为更大的关注点是可维护性......对于CSS而言,这与任何其他类型的代码一样多。

虽然将你的hacks和其他css“修复”组织成通过条件逻辑加载的单独文件,但从一个错误的角度看是很好的......它实际上可能会造成维护麻烦。

根据我的经验,最好使用他们为任何给定浏览器修复的基本CSS。这使得将UI的某些特定元素组合在一起的CSS可以在一个地方进行管理,这使得管理CSS 显着更容易,并且还明确了未来可能(或可能)适合浏览器css错误的修复方法应放置。

除了将你的hack放在与它们相关的基本css之后,你还应该确保它清楚地解决了给定hack修复的问题,以及hack支持的浏览器和注释。我曾经在一些大型项目中进行过广泛和高级的使用,但我们仍然需要支持IE6。从长远来看,我和我的团队(顺便说一下,都是C#开发人员...在这个特殊的工作开发人员不仅编码,而且根据我们的图形设计师创建的UI模型完成了所有UI实现)了解到你可以实际使用CSS可以很好地设置任何网站的样式而不需要黑客攻击(这可能很困难,并且需要一些关于CSS如何工作的广泛知识......但是有可能解决IE和Firefox中的几乎所有错误而没有黑客......只是聪明/正确使用有效的CSS)。

然而,在我的团队学到足够的CSS来实现这一目标之前,我们有更多的黑客可以计算。保持我们的黑客与他们修复的基本css一起被标记每个黑客有一个理由和浏览器或支持黑客的浏览器在很大程度上保持我们可怕的CSS文件可维护。这不仅有助于提高可维护性......但随着您了解更多关于CSS并找出避免黑客攻击的方法......当您修复现有的CSS以使用新技巧时,您将能够一点一点地删除它们。由于你的黑客正好在你的改进之后,它很容易摆脱不再需要的黑客。

答案 2 :(得分:0)

那些是HACKS而不是条件。

不要误会我做同样的事情:\有时是基于案例的场景。如果您与大型网站的交易使用CONDITIONALS。

如果你做了一些废话你不关心使用黑客。

差异如下:

HACKS - 暂时工作,直到有人修复它们,而这些它们实际上不会 条件 - 保证工作

答案 3 :(得分:0)

我已经使用条件注释将ID包装在DIV中,定位正确的IE版本,如here所述。

这更容易维护(就像你说的那样),保持你的css有效(没有错误可以忽略)并且比黑客更稳定......

答案 4 :(得分:0)

这可能是offtopic,我不是CSS的大师......但是,你尝试过SASS吗?

http://haml.hamptoncatlin.com/docs/

我发现CSS相当差,作为风格的表达语言。横向思维,如果你有一个主要风格的中心protoCSS并且它可以将它们转换为适当的浏览器版本,我认为你会尽可能地使用它:可维护且易于使用。

Sass并非如此,但改变它并不困难。如果您不是开发人员,我相信您将能够说服汉普顿或其他人对其进行编码。