浏览器专属CSS开发

转发下，同事总结的。
浏览器大战的结果曾经一度是IE一统天下，在那个时代，我们根本不用担心浏览器兼容性问题，用PS自动生成代码都行。然而伴随时代发展，人们对WEB应用的期望越来越高，于是乎，江湖烽烟再起，各种浏览器如雨后春笋，这可苦了我们这些开发者，为了让各浏览器表现一致，不知道有多少前辈耗费了多少心血，现在，让我们踩在前辈的肩膀上继续去奋斗吧。
日常工作我们经常需要区分Firefox和IE系列浏览器，这里有一个使用的快速方法：
background:blue;
/* Firefox */
background:red \9; /* IE8（只有IE系列浏览器认识\9）
*/
*background:black; /* IE7（IE6/IE7认识星星）*/
_background:orange; /* IE6
（IE6认识下划线） */
测试地址：
http://webtech.intra.sina.com.cn/?page_id=39
如果想更深入的研究，那么这里有更多的例子：
/* Opera */
html:first-child #opera
{
display: block;
}
/* IE 7 */
html > body #ie7
{
*display: block;
}
/* IE 6 */
body #ie6
{
_display: block;
}
/* Firefox 1 - 2 */
body:empty #firefox12
{
display: block;
}
/* Firefox */
@-moz-document url-prefix()
{
#firefox { display: block; }
}
/* Safari */
@media screen and (-webkit-min-device-pixel-ratio:0)
{
#safari { display: block; }
}
/* Opera */
@media all and (-webkit-min-device-pixel-ratio:10000), not all and (-webkit-min-device-pixel-ratio:0)
{
head~body #opera { display: block; }
}
以上都是前辈实践摸索出来的hack方式，用以区分不同浏览器，不过呢，当今世界的浏览器主要分为四大内核：
渲染引擎
浏览器
Trident
Internet Explorer
Gecko
Mozilla Firefox
WebKit
Safari、google Chrome
Presto
Opera
官方的文档都有说明，可以使用前缀
来实现各引擎的私有属性：
-o-:以Presto为渲染引擎的浏览Opera的私有属性、
-moz-:以Gecko为渲染引擎的浏览器Mozilla Firefox的私有属性
-webkit-:以Webkit为渲染引擎的浏览器Safari、Google Chrome的私有属性
IE8开始引入-ms-前缀用以区分私有属性的方式，详见：
https://blogs.msdn.com/ie/archive/2008/09/08/microsoft-css-vendor-extensions.aspx

另外IE还可以通过条件注释来加以区分，详见：
http://www.quirksmode.org/css/condcom.html
http://msdn.microsoft.com/en-u