首頁 >web前端 >css教學 >如何使用有效的 CSS 定位 IE7 和 IE8?

如何使用有效的 CSS 定位 IE7 和 IE8?

DDD
DDD原創
2024-10-29 00:43:30246瀏覽

How can I target IE7 and IE8 with valid CSS?

使用有效的CSS 定位IE7 和IE8

使用CSS 定位特定的IE 版本可能具有挑戰性,因為針對一個版本應用修復可能不起作用對於另一個。本指南概述了使用有效 CSS 定位 IE7 和 IE8 的兩種方法:使用 HTML 和 CSS 而不使用 hacks,以及使用 CSS「hacks」。

明確定位而不使用 Hacks

為了避免使用 hack,請將瀏覽器唯一的類別加入 中。元素並稍後根據瀏覽器進行選擇。例如:

<code class="html"><!doctype html>
<!--[if IE]><![endif]-->
<!--[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 IE 9 ]>    <html lang="en" class="ie9">    <![endif]-->
<!--[if (gt IE 9)|!(IE)]><!--><html lang="en"><!--<![endif]--></code>

然後,將CSS 定位專門應用於所需的瀏覽器版本:

<code class="css">.ie6 body { 
    border:1px solid red;
}
.ie7 body { 
    border:1px solid blue;
}</code>

使用CSS Hacks 進行定位

使用CSS Hacks 進行定位

  • 至使用hacks 定位IE 版本,請使用以下字元:
  • 「9」:目標IE8 及更低版本
  • 「*」:目標IE7 及更低版本

「_ ": 目標IE6

<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>

範例:

目標IE10

<code class="html"><!doctype html>
    <html lang="en">
    <!--[if !IE]><!--><script>if (/*@cc_on!@*/false) {document.documentElement.className+=' ie10';}</script><!--<![endif]-->
        <head></head>
        <body></body>
</html></code>
目標IE10元素使用:

以上是如何使用有效的 CSS 定位 IE7 和 IE8?的詳細內容。更多資訊請關注PHP中文網其他相關文章!

陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn