thể trùng lặp:
How do I do IE conditionals in CSS?Áp dụng quy tắc CSS nếu trình duyệt là IE
Làm thế nào tôi có thể áp dụng các quy tắc dưới đây để chỉ IE?
.abc {
float:left;
height:0;
margin:0 10px;
width:0;
/*Apply these rules for IE only*/
position:absolute;
left:30;
top:-10;
/*Apply these rules for IE only*/
}
Trong các trình duyệt đến và bao gồm IE9, việc này được thực hiện thông qua conditional comments.
<!--[if IE]>
<style type="text/css">
IE specific CSS rules go here
</style>
<![endif]-->
Cách tốt để tránh tải nhiều tệp CSS hoặc có CSS nội tuyến là đưa một lớp vào thẻ nội dung tùy thuộc vào phiên bản Internet Explorer. Nếu bạn chỉ cần hacks IE nói chung, bạn có thể làm một cái gì đó như thế này, nhưng nó có thể được mở rộng để có phiên bản cụ thể:
<!--[if IE ]><body class="ie"><![endif]-->
<!--[if !IE]>--><body><!--<![endif]-->
Bây giờ trong mã css của bạn, bạn chỉ có thể làm:
.ie .abc {
position:absolute;
left:30;
top:-10;
}
Điều này cũng giữ cho các tệp CSS của bạn hợp lệ, vì bạn không phải sử dụng các dấu gạch ngang CSS (và không hợp lệ).
Một cách tiếp cận nhanh chóng là sử dụng sau đây theo nghĩa mà bạn muốn tập trung (kiểm tra các ý kiến), bên trong file css của bạn (nơi margin-top, thiết lập bất cứ điều gì css thuộc tính bạn muốn):
margin-top: 10px\9; /*It will apply to all ie from 8 and below */
*margin-top: 10px; /*It will apply to ie 7 and below */
_margin-top: 10px; /*It will apply to ie 6 and below*/
Cách tiếp cận tốt hơn là kiểm tra tác nhân người dùng hoặc điều kiện nếu, để tránh tải CSS không cần thiết trong các trình duyệt khác.
\ 9 hoạt động trong 9 & 10 – Jon
Còn IE11 thì sao? Tôi đã thử margin-top: 10px \ 9, margin-top: 10px \ 10 và margin-top: 10px \ 11 mà không thành công – Guillaume
Thử ie10 + hack của tôi _: - ms-fullscreen,: root .selector {margin-top: 10px; } và hack ie11 của tôi: _: - ms-lang (x), .selector {margin-top: 10px; } Họ sẽ giúp bạn. Kiểm tra chúng tại đây: http://browserstrangeness.bitbucket.org/css_hacks.html#msie –
Tôi thích sử dụng tệp riêng cho các quy tắc tức là, như được mô tả trước đó.
<!--[if IE]><link rel="stylesheet" type="text/css" href="ie-style.css"/><![endif]-->
Và bên trong nó, bạn có thể thiết lập quy tắc cho các phiên bản khác nhau của ví dụ sử dụng này:
.abc {...} /* ALL MSIE */
*html *.abc {...} /* MSIE 6 */
*:first-child+html .abc {...} /* MSIE 7 */
này sẽ không làm việc cho IE10 và sau đó. –
đây không phải là câu trả lời nữa – abzarak
@abzarak sau đó cung cấp một cái mới, chính xác mà OP có thể đánh dấu là được chấp nhận thay vì cái này –