ホームページ > 記事 > ウェブフロントエンド > CSSの使用法 @import_html/css_WEB-ITnose
CSSの使用法 @import_html/css_WEB-ITnose
- WBOYオリジナル
- 2016-06-21 09:10:211679ブラウズ
CSS での @import の使用法:
@import は多くのページで使用されていますが、使用頻度はまだリンクタグに比べてはるかに少ないため、あまり馴染みのないレイアウトデザイナーも多いかもしれません。以下に簡単に使い方を紹介します。外部スタイルシートを導入する方法には 2 つの形式があります:
@import "style.css";@import url("style.css"); @import はページに外部スタイルシートを導入するか、1 つのスタイルシート内に別のスタイルシートを導入できます。 コード例は次のとおりです。 :
<!DOCTYPE html> <html> <head> <meta charset=" utf-8"> <meta name="author" content="http://www.softwhy.com/" /> <title>蚂蚁部落</title> <style type="text/css">@import "mytest/div+css/mytest.css";</style> </head> <body> <div id="mytest">蚂蚁部落</div> </body> </html>
上記のコードは、@import を通じて Web ページに外部スタイル シートを導入し、フォントの色を赤に設定します。
例 2:
@import は、他のスタイル ファイルをスタイル ファイルに導入することもできます。たとえば、Web サイトに大量のコードがあり、CSS スタイル シート ファイルも比較的大きい場合は、この方法を使用して結合できます。さまざまな機能モジュールのスタイル コードをそれぞれのスタイル シートに配置し、@import を通じてメイン スタイル シートに導入します。
@charset "utf-8";/* CSS Document */@import url("one.css");@import url("two.css");@import url("three.css"); 注: ただし、 @import を使用して読み込まれるスタイル ファイルはページが読み込まれるまで待機するため、使用しないことをお勧めします。代わりにタグを使用することをお勧めします。 CSS リンクと @import の違いに関する章を参照してください。
元のアドレスは次のとおりです: http://www.51texiao.cn/div_cssjiaocheng/2015/0503/585.html
最も元のアドレスは次のとおりです: http://www.softwhy.com/