IEと互換性のあるCSSの書き方にはどのようなものがありますか?-CSSチュートリアル-php.cn

IEと互換性のあるCSSの書き方にはどのようなものがありますか?

醉折花枝作酒筹

リリース： 2023-01-06 11:16:02

オリジナル

3485 人が閲覧しました

IE と互換性のある CSS の記述方法は、 1. 属性の前に「-」または「_」を追加し、「_attribute: 属性値」で記述します。 2. CSS の条件付きコメント、構文 ""。

IEと互換性のあるCSSの書き方にはどのようなものがありますか?

このチュートリアルの動作環境: Windows 7 システム、CSS3&&HTML5 バージョン、Dell G3 コンピューター。

1. Hack

書き方:

.demo {
margin-left:30px; 
_margin-left:20px; 
}

ログイン後にコピー

メリット:

1. CSSに埋め込まれているので、書くときにとても便利です

2. CSS に埋め込まれているため、それ以上の HTTP リクエストは生成されません

欠点:

##1. 1 つのモジュールに統合されていないため、後のメンテナンスや変更が面倒になります

#2 . この書き方がうまくいかなかったとしても、ブラウザがコードを読み込んでリソースを無駄にしてしまいます

2. CSS条件付きコメント

書き方:

<!--[if IE 6 ]>
    <link rel="stylesheet" type="text/css" media="all" href="./ie6.css" />
<![endif]-->

ログイン後にコピー

メリット：

1. コードは独立しているため、後のメンテナンスに役立ちます

2. コードが機能しないブラウザの場合、このコードは単なる通常のコメントであり、ロード時にロードされませんコンテンツをロードしてリソースを保存します。

欠点:

1. 新しい HTTP リクエストが追加されるため、間違いなく古いバージョンの IE ブラウザへの負荷が増大します。

拡張子:

HTML タグの条件付きコメント

<!DOCTYPE html>   
<!--[if IE 6 ]> <html class="ie6 lte_ie6 lte_ie7 lte_ie8" lang="zh-CN"> <![endif]-->
<!--[if lte IE 6 ]> <html class="lte_ie6 lte_ie7 lte_ie8" lang="zh-CN"> <![endif]-->
<!--[if lte IE 7 ]> <html class="lte_ie7 lte_ie8" lang="zh-CN"> <![endif]-->
<!--[if lte IE 8 ]> <html class="lte_ie8" lang="zh-CN"> <![endif]-->
<!--[if (gte IE 9)|!(IE)]><!--><html lang="zh-CN"><!--<![endif]-->

ログイン後にコピー

.ie6 .demo {  
    margin-left: 20px;
      }

ログイン後にコピー

このメソッドはコードを別のモジュールに分割でき、新しい HTTP リクエストは追加されません。現在はさらに使用されています。

推奨学習:

css ビデオチュートリアル

以上がIEと互換性のあるCSSの書き方にはどのようなものがありますか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。