1

我突然想到，在过去的十年里，所有关于 HTML/CSS 的书籍总是谈论浏览器不兼容以及如何通过向 CSS、JS 或 HTML 添加更多“hacks”来解决这个问题。为什么他们从未建议过另一种解决方法（我相信最好的方法）是在 html 文件的第一行添加代码（php、c 等），检测正在使用的浏览器然后添加为该浏览器提供适当的 CSS/JS 文件？

4

7 回答 7

4

过去，您会在 JavaScript 中添加 hack 来确定客户端正在使用哪个浏览器并基于此运行代码。似乎没有确定的最佳方法，所以每本书都有自己的实现。

您会在很多旧书中找到用于确定浏览器的代码，然后在整个代码中您会看到如下内容：

if (NS4) {

} elseif (IE) {

}

但现在基本上已经过时了。

我们现在拥有的另一件大事是像 JQuery 这样的框架，它希望抽象出一些仍然存在的现有不兼容性。在我看来，过去人们只会推出自己风格的 JQuery-esq 框架，所以没有一个统一的框架被更大的社区接受。

我最喜欢的关于用户代理字符串的引用之一是随 Chrome 一起发布的：

“因此 Chrome 使用 WebKit，并且伪装成 Safari，WebKit 伪装成 KHTML，KHTML 伪装成 Gecko，所有的浏览器都伪装成 Mozilla，Chrome 将自己称为 Mozilla/5.0（Windows；U；Windows NT 5.1 ; en-US) AppleWebKit/525.13 (KHTML, like Gecko) Chrome/0.2.149.27 Safari/525.13，用户代理字符串完全一团糟，几乎没用，每个人都假装成其他人，混乱比比皆是。”

这是一部很好的喜剧读物 - http://webaim.org/blog/user-agent-string-history/

于 2009-05-26T23:06:44.167 回答
2

这是因为服务器/客户端的划分。无法从服务器上运行的代码中检测客户端设置。

HTML 中有条件注释，如果您愿意，可以加载备用 CSS 或 Javascript 文件。

关于条件注释的快速参考

于 2009-05-26T22:59:06.960 回答
2

因为那时你必须维护两组css和js文件。这与向一个文件中添加“hacks”并没有什么不同，只是每次进行更改时都必须对两个文件进行更改。

于 2009-05-26T22:59:53.417 回答
1

如果您使用纯粹的浏览器检测，则每次发布新的浏览器或浏览器版本时，您都需要更新您的列表。这会导致荒谬的情况，例如新版本的用户被告知升级降级到旧版本。

浏览器不一致应通过功能测试来处理。正如其他人所提到的，有像 JQuery 这样的 JavaScript 框架可以为您处理这个问题。关于 CSS，正如其他人所提到的，使用条件注释来定位旧版本的 Internet Explorer。尽量避免使用“hacks”，因为它们可以在较新的版本中修复，而不会修复您试图解决的问题。

于 2009-05-26T23:13:09.007 回答
0

我认为有一个更好的解决方案：

简单的解决方案，只需使用这个 JS 库，您就可以轻松地为每个浏览器/操作系统组合应用样式：

浏览器类.js

这样，您将在 body 标记上获得一个类名，其中包含当前名称和浏览器版本以及使用的操作系统。

包含文件后：

<script src="js/browserclass.js"></script>

例如，在带有最新 chrome 的 Windows 8.1 上，您将看到：

<body class="chrome chrome34 win desktop">

在您的样式文件中，您可以参考：（.sass 样式）

body.chrome
  #example
    color: blue

或者

body.win.chrome
  #example
    color: red

笔记：

[if IE] 语句自 IE10 以来已弃用，因此这是解决方案

于 2014-04-15T20:45:10.487 回答
0

为了进一步说明 Matthew Vines 所说的，条件注释看起来有点像这样......

<!--[if lte IE 6]><link href="LayoutIE6.css" type="text/css" rel="stylesheet" /><![endif]-->
<!--[if gte IE 7]><link href="LayoutIE7.css" type="text/css" rel="stylesheet" /><![endif]-->
<!--[if !IE]><link href="Layout.css" type="text/css" rel="stylesheet" /><![endif]-->

希望这可以帮助 ：）

于 2009-05-26T23:02:25.253 回答
0

这是因为（在大多数情况下，甚至“传统上”）CSS 黑客是/由前端开发人员实现的，他们并不总是可以访问后端脚本。如果早期 Web 开发是由后端开发人员推动的，我经常认为情况会大不相同。

顺便说一句，我认为这根本不是一个坏问题（最初由于某种原因被否决）。而且，为了记录，CSS 的条件注释和像 jQuery 这样的稳定​​ JS 框架绝对是要走的路。

于 2009-05-26T23:04:59.193 回答