朋友，请帮我定义IE9的特定CSS规则吗？
例如像这样
/ * IE 6 fix * /
* html .twit-post。 delete_note a {background-position-y：2px; }
* html .twit-post .delete_note a：hover {background-position-y：-14px; }注意接受的答案也针对IE10。因此，对于更完整的列表：
* html .ie6 {property：value;}
或
.ie6 {_property：value;}
* + html .ie7 {property：value;}
或
*：first-child + html。 ie7 {property：value;}
@media screen\9 {
.ie67 {property：value;}
}
或
.ie67 {* property：value; }
或
.ie67 {#property：value;}
@media \0screen\，screen\9 {
.ie678 {property：value;}
}
html> / ** / body .ie8 {property：value;}
或
@media \0screen {
.ie8 {property：value;}
}
.ie8 {property / * \ ** /：value\9}
$ b b
@media screen\0 {
.ie8910 { value;}
}
@media屏幕和（最小宽度：0）和（最小分辨率：.001dpcm）{
// IE9 CSS
.ie9 { property：value;}
}
@media screen and（min-width：0）and（min-resolution：+ 72dpi）{
// IE9 + CSS
.ie9up {property：value;}
}
@media screen and（min-width：0）{
.ie910 {property：value;}
}
_： - ms-lang（x），.ie10 {property：value\9; }
_： - ms-lang（x），.ie10up {property：value; }
或
@media all和（-ms-high-contrast：none），（-ms-high-contrast：active）{
.ie10up {property：value;}
}
_： - ms-fullscreen，：root .ie11up {property：value; }
Javascript：
var b = document.documentElement;
b.setAttribute（'data-useragent'，navigator.userAgent）;
b.setAttribute（'data-platform'，navigator.platform）;
b.className + =（（!!（'onuchstart'in window）|| !!（'onmsgesturechange'in window））？'touch'：''）;
将以下内容添加到 html 元素：
data-useragent ='Mozilla / 5.0（兼容; MSIE 9.0; Windows NT 6.1; Trident / 5.0; SLCC2 ; .NET CLR 2.0.50727; .NET CLR 3.5.30729; .NET CLR 3.0.30729; Media Center PC 6.0; .NET4.0C）'
data-platform ='Win32'
允许非常targetted的CSS选择器，例如：
html [data-useragent * ='Chrome / 13.0'] .nav {
background：url（img / radial_grad.png）
}
Footnote
如果可能，请避免指定浏览器。识别并解决您识别的任何问题。支持和。考虑到这一点，这是一个理想的世界场景，在生产环境中不总是可以获得的，因此上述内容应该有助于提供一些好的选择。
归因/基本阅读
-
-
-
Friends, please help me in defining specific css rule for IE9?For example like this
/* IE 6 fix */
* html .twit-post .delete_note a { background-position-y: 2px; }
* html .twit-post .delete_note a:hover { background-position-y: -14px; }
解决方案 Note the accepted answer also targets IE10. As such, for a more complete list:
IE 6
* html .ie6 {property:value;}
or
.ie6 { _property:value;}
IE 7
*+html .ie7 {property:value;}
or
*:first-child+html .ie7 {property:value;}
IE 6 and 7
@media screen\9 {
.ie67 {property:value;}
}
or
.ie67 { *property:value;}
or
.ie67 { #property:value;}
IE 6, 7 and 8
@media \0screen\,screen\9 {
.ie678 {property:value;}
}
IE 8
html>/**/body .ie8 {property:value;}
or
@media \0screen {
.ie8 {property:value;}
}
IE 8 Standards Mode Only
.ie8 { property /*\**/: value\9 }
IE 8,9 and 10
@media screen\0 {
.ie8910 {property:value;}
}
IE 9 only
@media screen and (min-width:0) and (min-resolution: .001dpcm) {
// IE9 CSS
.ie9{property:value;}
}
IE 9 and above
@media screen and (min-width:0) and (min-resolution: +72dpi) {
// IE9+ CSS
.ie9up{property:value;}
}
IE 9 and 10
@media screen and (min-width:0) {
.ie910{property:value;}
}
IE 10 only
_:-ms-lang(x), .ie10 { property:value\9; }
IE 10 and above
_:-ms-lang(x), .ie10up { property:value; }
or
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
.ie10up{property:value;}
}
IE 11 (and above..)
_:-ms-fullscreen, :root .ie11up { property:value; }
Javascript alternatives
Modernizr
User agent selection
The Javascript:
var b = document.documentElement;
b.setAttribute('data-useragent', navigator.userAgent);
b.setAttribute('data-platform', navigator.platform );
b.className += ((!!('ontouchstart' in window) || !!('onmsgesturechange' in window))?' touch':'');
Adds (e.g) the below to the html element:
data-useragent='Mozilla/5.0 (compatible; MSIE 9.0; Windows NT 6.1; Trident/5.0; SLCC2; .NET CLR 2.0.50727; .NET CLR 3.5.30729; .NET CLR 3.0.30729; Media Center PC 6.0; .NET4.0C)'
data-platform='Win32'
Allowing very targetted CSS selectors, e.g.:
html[data-useragent*='Chrome/13.0'] .nav{
background:url(img/radial_grad.png) center bottom no-repeat;
}
Footnote
If possible, avoid browser targeting. Identify and fix any issue(s) you identify. Support progressive enhancement and graceful degradation. With that in mind, this is an 'ideal world' scenario not always obtainable in a production environment, as such- the above should help provide some good options.
Attribution / Essential Reading
这篇关于如何为IE9单独定义特定的CSS规则？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！