Html 针对 Chrome、IE、Firefox 的 CSS 检查
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/2846361/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
CSS check for Chrome, IE, Firefox
提问by hankh
I've noticed a small alignment issue in the three major browsers when rendering my web site. As such how can I perform the following pseudo-code with pure CSS?
在渲染我的网站时，我注意到三个主要浏览器中的一个小对齐问题。因此，如何使用纯 CSS 执行以下伪代码？
if Webkit (Safari/Chrome) {
#myDIV {margin-top:-3px}
} else if (Firefox) {
#myDIV {margin-top:0px}
} else { // IE and other browsers
#myDIV {margin-top:1px}
}
回答by SLaks
You can use a CSS Hack.
您可以使用CSS Hack。
However, I wouldn't recommend it.
但是，我不会推荐它。
For IE, you can include a separate CSS file or <style>tag inside a conditional comment, like this:
对于 IE，您可以<style>在条件注释中包含一个单独的 CSS 文件或标签，如下所示：
<!--[if IE] <tag> <![endif]-->
回答by ChrisBenyamin
If its only one property, you don't need conditional comments for including other files. But if you want it that way, do it like SLaks already wrote. Another approach is just to add a property at the end of your specific class with a browser specific hack.
如果它只有一个属性，则不需要条件注释来包含其他文件。但如果你想要那样做，就像 SLaks 已经写的那样。另一种方法是使用特定于浏览器的 hack 在特定类的末尾添加一个属性。
.foo {
margin-top: 5px; // general property
_margin-top: 2px; //IE 6 and below
}
Or you seperate your classes and add under your general class a browser specific class.
或者，您将类分开并在通用类下添加浏览器特定类。
/* general */
foo {
width : 20em;
}
/* IE 6 */
* html foo {
width : 27em;
}
/* IE 7 */
* + html foo {
width : 29em;
}
回答by Jake Petroules
You can't really do this with pure CSS. The best way to do so would be using server-side code like ASP.NET or PHP to read the "user-agent" header of the HTTP request and determine what browser your visitors are using by searching for keywords in that string. For example, my user agent is:
你真的不能用纯 CSS 来做到这一点。这样做的最佳方法是使用服务器端代码（如 ASP.NET 或 PHP）读取 HTTP 请求的“用户代理”标头，并通过搜索该字符串中的关键字来确定访问者使用的浏览器。例如，我的用户代理是：
Mozilla/5.0 (Windows; U; Windows NT 6.1; en-US; rv:1.9.2.3) Gecko/20100401 Firefox/3.6.3
Mozilla/5.0 (Windows; U; Windows NT 6.1; en-US; rv:1.9.2.3) Gecko/20100401 Firefox/3.6.3
What you could do is have a collection of if-else statements looking for strings in the user-agent like "Firefox" or "MSIE" or "WebKit", and then serve different individual CSS files depending on what browser is being used.
您可以做的是使用一组 if-else 语句在用户代理中查找字符串，例如“Firefox”或“MSIE”或“WebKit”，然后根据所使用的浏览器提供不同的单独 CSS 文件。
You could do the same thing with JavaScript, but remember that users may have JavaScript disabled, or more likely their device might not support it... whereas virtually any HTTP request will send a user-agent string.
你可以用 JavaScript 做同样的事情，但请记住，用户可能禁用了 JavaScript，或者更有可能他们的设备可能不支持它......而实际上任何 HTTP 请求都会发送一个用户代理字符串。
