浏览器兼容性的问题是前端开发中常见的挑战之一。为了解决不同浏览器的兼容性问题，开发者通常使用一些特殊的CSS hack或技巧。这些技巧可能不是最优雅的解决方案，但在某些情况下是必需的。以下是一些常见的CSS浏览器兼容性hack：

1. 盒模型兼容性：

IE6 和 IE7：
/* 触发 IE6 和 IE7 的怪异盒模型 */
* {
    *zoom: 1;
    *display: inline;
}

2. IE 浏览器选择器：

IE6：
/* 仅在 IE6 中生效 */
* html .my-selector {
    /* 样式规则 */
}

IE7：
/* 仅在 IE7 中生效 */
*:first-child + html .my-selector {
    /* 样式规则 */
}

3. IE8 及以下版本：
/* 仅在 IE8 及以下版本中生效 */
.my-selector {
    color: #000 \9;
}

4. IE9 及以上版本：
/* 仅在 IE9 及以上版本中生效 */
.my-selector {
    color: #000 \0/;
}

5. Webkit 和 Blink 浏览器（Chrome 和 Safari）：
/* 仅在 Webkit/Blink 浏览器中生效 */
@media screen and (-webkit-min-device-pixel-ratio:0) {
    .my-selector {
        /* 样式规则 */
    }
}

6. Firefox 浏览器：
/* 仅在 Firefox 浏览器中生效 */
@-moz-document url-prefix() {
    .my-selector {
        /* 样式规则 */
    }
}

7. 全局选择器：

IE6 和 IE7：
/* 仅在 IE6 和 IE7 中生效 */
body {
    _height: 1px;
    font-size: 0;
    margin: 0;
    overflow: hidden;
}

8. IE11 及以上版本：
/* 仅在 IE11 及以上版本中生效 */
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
    .my-selector {
        /* 样式规则 */
    }
}

请注意，使用hack时需要小心，最好只在确实存在兼容性问题的情况下使用，并且最好注释清楚为什么使用这些hack。随着浏览器的更新，一些hack可能会过时或失效，因此在使用之前最好先测试。最好的做法是尽量避免使用hack，而是采用更现代的解决方案，例如使用Feature Queries等。


转载请注明出处：http://www.zyzy.cn/article/detail/4052/CSS