ホームページ > 記事 > ウェブフロントエンド > IEと互換性のあるCSSの書き方にはどのようなものがありますか?
IEと互換性のあるCSSの書き方にはどのようなものがありますか?
- 醉折花枝作酒筹オリジナル
- 2021-06-01 16:45:363377ブラウズ
IE と互換性のある CSS の記述方法は、 1. 属性の前に「-」または「_」を追加し、「_attribute: 属性値」で記述します。 2. CSS の条件付きコメント、構文 "80f5a74b4578b0b7e34d4bbd6d76f349d367aa0196d6d2aef0ee50aa5fd621d91b771f47d72d900ba74308aee59557f0"。
このチュートリアルの動作環境: 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 リクエストは追加されません。現在はさらに使用されています。
推奨学習:
以上がIEと互換性のあるCSSの書き方にはどのようなものがありますか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。