Home > Article > Web Front-end > How to Target IE7 and IE8 with CSS: A Comprehensive Guide
How to Target IE7 and IE8 with CSS: A Comprehensive Guide
- Linda HamiltonOriginal
- 2024-10-29 07:25:02858browse
Targeting IE7 and IE8 with CSS: A Comprehensive Guide
To achieve targeted styling for IE7 and IE8 without compromising W3C compliance, employing explicit browser-specific classes is an effective method. This eliminates the need for unreliable CSS hacks.
Approach 1: Browser-Specific HTML Classes
Add HTML classes to the element based on the browser:
<code class="html"><!doctype html> <!--[if lt IE 7 ]> <html lang="en" class="ie6"> <![endif]--> <!--[if IE 7 ]> <html lang="en" class="ie7"> <![endif]--> <!--[if IE 8 ]> <html lang="en" class="ie8"> <![endif]--> <!--[if (gt IE 9)|!(IE)]><!--><html lang="en"><!--<![endif]--></code>
This allows you to target specific browsers in your CSS:
<code class="css">.ie6 body {
border:1px solid red;
}
.ie7 body {
border:1px solid blue;
}</code>
Approach 2: CSS Hacks
Alternatively, you can use CSS hacks to target IE versions:
- "9" targets IE8 and below
- "*" targets IE7 and below
- "_" targets IE6
Example:
<code class="css">body {
border:1px solid red; /* standard */
border:1px solid blue; /* IE8 and below */
*border:1px solid orange; /* IE7 and below */
_border:1px solid blue; /* IE6 */
}</code>
Targeting IE10
IE10 does not recognize conditional statements. To target it, use this script:
<code class="html"><!doctype html>
<html lang="en">
<!--[if !IE]><!--><script>if (/*@cc_on!@*/false) {document.documentElement.className+=' ie10';}</script><![if lt IE 9]><![endif]-->
<head></head>
<body></body>
</html></code>The above is the detailed content of How to Target IE7 and IE8 with CSS: A Comprehensive Guide. For more information, please follow other related articles on the PHP Chinese website!
Statement：
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn