ホームページ > ウェブフロントエンド > htmlチュートリアル > コンポーネント化された CSS はサイト全体の CSS ファイルを管理します_html/css_WEB-ITnose

コンポーネント化された CSS はサイト全体の CSS ファイルを管理します_html/css_WEB-ITnose

WBOY
リリース: 2016-06-24 12:01:20
オリジナル
1141 人が閲覧しました


スタイル ファイルを分割する理由

スタイル ルールを見つけやすくなり、特定のページに特定のスタイルを提供することもできます。ブリッジスタイルを追加するには?

HTML ドキュメントを変更せずに、いつでもスタイルを追加または削除できます。

2 つのメディア タイプを定義する理由

NN4

は @import をサポートしていないため、ブリッジ スタイルを認識できません。

@import 'footer.css';

@imports

どのように機能しますか?

@import は、古い

では使用できません。

ブラウザによって認識されます。

これは、

大規模サイト

にとって理想的な概念です。

ハックフリーの CSS IE などの迷惑なブラウザの互換性に対処することは、私たちの最大の悩みの種の 1 つです。

多くの友人は、これらの問題を解決するために

CSS Hack

を使用しています。

問題は、IE のバージョンをアップグレードしてサポートを改善した後です。 CSS、以前に使用したハックは 無効になります!

この問題をどのように解決しましたか? 「CSS ハックを使用せずにページを更新するようお願いします。IE をターゲットにする場合、または IE を回避したい場合は、

条件付きコメント

を使用できます。」 条件付きコメントはどのように機能しますか?

ステップ 1. IE 用のスタイル ファイルを作成する

ステップ 2. HTML ドキュメントの先頭に 条件付きコメントを追加する コード

指定されたもののみ IEブラウジング ブラウザのバージョンはこのハート スタイルを認識しますが、他のブラウザはそれを完全に無視します

特定の IE バージョン識別:

たとえば、ほとんどのブラウザはコンテナの幅にフィラーを追加しますが、IE5 は追加しません。この場合、IE5 は小さいコンテナーを表示します。 main.css (IE5 を含むすべてのブラウザーで認識されます):

#container{ width: 600px; padding: 100px;}

ie5.css (認識されるもののみ) IE5 による): #container {width: 800px; }

条件付きコメントが良い解決策である理由

1.

ハックなし特定の CSS ルールは新しいスタイル シートにのみ表示されます。

2.

ファイル分離

特定のバージョンの IE 用に定義されたスタイルは、メイン スタイル シートから分離されており、次のスタイル シートで使用できます。 IE ブラウザーがアップグレードして属性サポートを更新するときに、これらのファイルを簡単に削除します。

3. ターゲットを絞った

IE ブラウザーのさまざまなバージョンに対して、ターゲットを絞った方法で関連する属性を定義できます。

関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート