通常当我浏览互联网时,我发现人们通常使用CSS黑客来使他们的网站在所有浏览器中看起来都一样。就个人而言,我发现找到所有这些黑客并测试它们是非常耗时的;您所做的每项更改都必须在4个以上的浏览器中进行测试,以确保它不会破坏任何其他内容。
大约一年前,我浏览了互联网,了解其他主要网站正在使用的内容(雅虎,谷歌,BBC等),并发现大多数网站正在进行某种形式的浏览器检测(JS,HTML if语句,服务器)基于)。我也开始这样做了。在我最近工作的几乎所有网站上,我使用jQuery,所以我使用内置的浏览器检测。
您是否有使用或不使用其中任何一种的原因?
答案 0 :(得分:30)
还有第三种选择:
最大限度地减少或消除对浏览器检测和CSS黑客的需求。
我尝试使用像jQuery插件这样的东西来处理任何浏览器差异(对于小部件等)。这并没有照顾好一切,但它做了很多,并且已经将支持多个浏览器的工作委托给已经花费的人,并且将花费更多的努力,而不是你能负担或想要的。
之后我遵循这些原则:
之后,我将浏览器分为几层:
第1层:
我的网站必须才能解决这些问题。
第2层:
我的网站应该处理这些问题。这可能会冒犯一些人,但坦率地说,这些浏览器的市场份额非常低,以至于它们根本不像Firefox 3或IE7那么重要。
第3层:
除非是公司要求,否则将尽最大努力解决这些问题。 IE6是一场噩梦,但截至12月的market share为20%且迅速下降。此外,还有一些有效的安全问题(例如在金融网站上),用于劝阻甚至禁止使用IE6,例如Paypal have blocked IE6和Google tells users to drop IE6等网站。
答案 1 :(得分:11)
问题是你只能在css上获得一次(因为它几乎是客户端的静态内容)...你不能(轻松地)适应它以适应客户端的飞行 - 所以对于那些棘手的不兼容的情况(并且它们太多),检测是可悲的最佳途径。我不能很快看到这种变化。
使用javascript,你可以经常通过像(如你所述)jQuery这样的库来避免这种痛苦 - 并检查功能支持而不是识别特定的浏览器(大多数时候)。在某些情况下,您需要准确了解(例如,盒子模型)。
答案 2 :(得分:6)
您是否有使用或不使用其中任何一种的原因?
是。如果JavaScript被停用,客户端浏览器检测会中断,并且可能无法在将来的浏览器版本中正常运行。最后一个原因也适用于CSS黑客攻击。如果用户明确尝试破解它,服务器端浏览器检测会中断,但它仍然可能是一种可行的选择。
我建议:
确保您的代码在符合标准的浏览器中有效 - 即开发其中的一个或两个,然后检查browsershots.org。最有可能的是,可以使用一个样式表在所有这些样式表中实现所需的结果。
然后,有IE。如果只有几个问题,你可以使用CSS hack。否则,请使用条件注释。
修改强>
如果我也必须支持古代浏览器,我通常会采用优雅降级的方式:我只是让它们用基本样式表(字体大小,颜色......)显示纯HTML。所有花哨的东西都会被隐藏@import
规则。
答案 3 :(得分:4)
我通常喜欢为符合标准的浏览器(如Firefox和Safari)设置样式表,然后使用conditional comments检测Internet Explorer并为其提供包含特定于IE的修复和覆盖的附加CSS文件。
答案 4 :(得分:3)
在以编写HTML和CSS为生的6年中,我的绝大多数CSS问题都来自Internet Explorer。
正如其他答案中所指出的,您可以使用conditional comments向IE提供其他样式表(或将类添加到<body>
或<html>`` element, if you don’t like multiple stylesheets). Unlike CSS hacks, conditional comments are explicit and supported. Unlike trying to detect IE from the
用户代理字符串`中,保证会工作。
对于非IE CSS问题,我从未发现一个值得浏览器检测的问题。
答案 5 :(得分:2)
浏览器的浏览速度更快,但如果您正确构建,浏览器检测可以在CSS中提供更好的可读性。 如果你可以进行浏览器检测,同时可以在浏览器之间共享CSS,并且只有不同的css在单独的文件或其他什么,那么我会使用浏览器检测 - 因为这是新手可以理解的东西,其中CSS黑客攻击如果你不了解它们很难理解
答案 6 :(得分:2)
我更喜欢使用浏览器检测并将独立于浏览器的CSS放入其自己的文件中。
然而,最好的解决方案是找到默认情况下交叉兼容的CSS,并使用它。
答案 7 :(得分:2)
我尽量不使用它们。在很多情况下,通过简化标记的结构可以避免IE存在的问题。
如果您使用像Eric Meyer's这样的CSS重置,也会有所帮助。
我还缓慢但肯定地放弃了对IE6的支持作为一个原则问题,特别是考虑到IE6和IE7的最新安全问题 - 如果我们继续支持糟糕的浏览器,我们不会改变人们的浏览习惯和浏览器偏好。
答案 8 :(得分:2)
仔细考虑上述所有内容,尤其是关于doctype的指针。如果你必须应用CSS hack,对于特定的浏览器,知道黑客几乎总是可以避免。特别是对于干静态页面。
从开发这些东西的有限经验谈起......我假设你想制作一个没有凌乱的Adoobi购买软件的光滑网页:
Op3ra 9.6,S @ fari 3,Chr0me 1,1nternet Xpl0rer 6,7&amp; 8,Firefux 1.5
使用@import css规则抛弃古代浏览器中的css并让它们吃蛋糕。
使用对象检测和浏览器嗅探的组合来查找并消除问题浏览器(所有版本低于上述目标)。还要抓住你知道的古老浏览器不能达到速度(css属性你可以测试并与已知值进行比较)以防万一它们通过嗅探器,也使用条件注释踢出1E5喂它一些反css在它的路上冷静下来,类似于ie6,除非尽可能保持在jQu3ry中。
使用动态元素将jQu3ry libray加载到允许的浏览器中(任何未经过仔细测试的文件)。即当我们知道图书馆不起作用/我们让其他人进去时,我们甚至不会导入图书馆。
使用jQu3ry解决支持的浏览器中的任何问题,其中大部分问题只会在您的网页变为动态时亮起。使用jQu3ry增强布局并添加界面等...
使用媒体语句扩展此功能,您可以测试这些设备特有的css值,现在您将有更多知识用于调整布局(即销毁这些列并缩小这些图像)。关闭动画等等。
通过始终使用文本标签和一些定位技巧让它们消失,如果你必须先生华丽的菜单家伙,让它们消失......只是不要依靠图像或Javascript来浏览你的网站。
它很容易阻挡Netsc @ pe下面的任何东西4.给它们只是基本的Web,它本来就是这样的。即甚至不为它们指定背景或颜色,字体或任何东西。浏览器的默认值应该可以正常工作。信息可以访问。
事实上,我认为所有“可访问”的浏览器都将自己标识为N $ 4,因此我们可以轻松地将它们从动态演示文稿中删除,并防止我们自己搞砸残障人士。
唉,她是一艘优秀的船,但即使是一艘能让M $不知所措的好船也必须死。不要害怕我们现在有更好的一个;)
只需2美分,谨慎使用。
答案 9 :(得分:2)
检测浏览器服务器端有什么问题?似乎非常有效和万无一失(除了用户改变他们的用户代理字符串)。您可以使用PHP为页面选择样式表或为每个请求动态生成它 - 不确定其他语言是否允许您直接输出到文件并让您手动设置标题,但我无法想象它们不会让您识别用户代理,因此其中一个选项可能适用于任何服务器端环境。
答案 10 :(得分:1)
黑客将永远增加您的工作努力,并应优化工作
首先添加黑客,然后开始担心他们在不同浏览器和不同机器上的行为。
相反,您可以依赖供应商特定的css扩展 http://reference.sitepoint.com/css/vendorspecific
答案 11 :(得分:1)
[我的方法] [1]使用PHP类来检测操作系统,浏览器和浏览器版本。
[1]:我使用PHP类检测操作系统,浏览器和浏览器版本的方法http://reinholdweber.com/css/css-hacks-browser-version-detection-a-new-approach/
答案 12 :(得分:0)
就我个人而言,我发现找到所有这些黑客并测试它们是非常耗时的;您所做的每项更改都必须在4个以上的浏览器中进行测试,以确保它不会破坏任何其他内容。
你不应该在每个浏览器上测试'正确'的CSS黑客攻击。
这个想法是你编写符合标准的代码,然后添加特定的黑客来定位一个只有一个错误的浏览器(或渲染引擎)。例如,编写“* html #myelement”仅针对IE6的异常:没有其他浏览器会受到该hack的影响,因此无需对其进行详尽的测试。如果一些新的模糊浏览器出现并且犯了与IE6完全相同的错误,这可能只会出错,这是非常不可能的,不是你的错,而且你可以期望很快得到修复。
有些东西称自己为CSS hacks但使用无效的构造,例如“_propertyname”hack。这可能会破坏浏览器,因为当您使用无效代码时,每个浏不要使用这些。
老实说,无论如何不是以前的问题,主要是因为IE5已经死了。如果您使用标准模式doctype并写入标准,它将主要在当前一轮浏览器中工作。唯一真正存在的问题是IE6,您可以使用“* html”进行定位;你不太可能需要更多的CSS黑客攻击。谢天谢地,Box模型Hack的日子结束了。
答案 13 :(得分:0)
听你的代码!肯特贝克说。在Wing-Tsun他们说:就像弯曲的水!或者其他什么。
看,这是一个让Hack5了解html5的CSS Hack:http://blog.whatwg.org/styling-ie-noscript。
使用JS时也是如此:http://blog.whatwg.org/supporting-new-elements-in-ie。
将5页黑客解释与5行易于理解的代码进行比较。所以,使用JS。
事情有它们的好处和缺点。而您对事物的理解和实际代码的优雅引领了这一过程。
答案 14 :(得分:0)
CSS黑客攻击不是一种方法,因为浏览器一直在更新,而新的更新可能会破坏您的黑客攻击,而使用Javascript浏览器检测,您可以准确地确认浏览器的功能。但是,另一个选择是使用最小的CSS,以确保一切都在所有情况下都有效。用于UI的JQuery和其他javascript库具有关于浏览器功能的内置检测,因此您应该检查这些。