CSSスタイル2

I.はじめに挿入位置
このように別のファイルにCSSルールには、「外部スタイルシート」と呼ばれています。また、CSSは、HTML文書内の2つの位置が表示されることがあり、またルール：

ドキュメントの<head>要素にある<スタイル>内部要素、で。

要素は、スタイル特性、いわゆるスタイル特性値に位置決めすることができます。

場合は、次のように文書ヘッドの<style>要素に位置するCSSルールは、「内部スタイルシート」の例と呼ばれています。

<ヘッド>

<タイトル>内部スタイルシート</ TITLE>

<スタイルタイプ= "テキスト/ cssの">

体

{

色：＃000000;

背景色：#FFFFFF;

フォントファミリー：ゴシック、MS Pゴシック、サンセリフ;

}

{

フォントサイズ：18pt;

}

{

フォントサイズ：12ptの、

}

</スタイル>

</ head>の

スタイル属性は、HTML要素を使用する場合には、「インラインスタイルルール」と呼ばれています

一般的に、あなたは、インラインスタイルのルールと内部スタイルシートの使用を避ける必要がありますが、積極的に外部スタイルシートを使用する必要があります。いくつかのケースでは、前の2が役立つことが、はるかに優れたメンテナンス性外部スタイルシート間。

スタイルシート、Webページ内のルールではなく、外部ドキュメントへのリンクが含まれています。<head>要素内に配置<スタイル>要素。時には、また、単一のページのためのいくつかの追加のルールを含める必要があり、これらのルールが統一スタイルシートを共有するサイト内の他のすべてのページのためのケースである必要はありません。

必須ではありませんが、<スタイル>要素を使用しますが、全て共通に加えて、type属性は、要素の特徴いつもとする場合もキャリーがある場合があります。

タイプのメディアがスコープ

Waibuyangshibiaoは、使用して、<link>要素をロード。したがって、CSSを継続する前に、最初の<link>要素と関連するプロパティで少し詳しく見ていきます。

二、<link>要素

二つの文書が自動的にユーザーに関連付けられているため<A>異なる要素とのリンクのこのタイプは、アクティベーションリンクをクリックして何も持っていません。

<リンク>要素は空要素が常にある、と渡すためにスタイルシートを使用した場合、2つのプロパティを持っている必要があります：RELとHREFを。次の例では、ページを使用してHTMLページ内の<link>要素は、CSSスタイル設定interface.cssファイル名を指定するために使用されなければならない、とCSSのと呼ばれるサブディレクトリ内のCSSファイル。

<リンクのrel = "スタイルシート" のhref = "... / CSS / interface.css">

コアの特性に加えて、<link>要素は、さらに以下の特徴を有していてもよいです。

文字セットのhref HREFLANGメディアRELタイプサイズ対象

1.relの機能：

相対特性は、文書間の関係に指定された接続ポイントへのリンクが含まれている文書に必要な特性です。スタイルシートをリンクするための鍵は、「スタイルシート」である
2.href特徴：

href属性は、文書のURLへのリンクを指定するために使用されます。

href =「... /スタイルシート/ interface.css」

スタイルシートは、サイトの一部であるため、このプロパティの値は、絶対的または相対URLが、通常は相対URLにすることができます。

3.media特性
メディアプロパティは、文書の出力デバイスを指定するために使用されるべきです。

メディア=「画面」

このサイトは、常にこの機能を使用しませんが、人々がインターネットにアクセスするためにさまざまな方法で異なるデバイスを使用するためには、非常に重要ですが。

第三に、外部スタイルシートの使用

外部スタイルシートを使用するときは、外部スタイルシートファイルを定義する必要があります。外部スタイルシートファイルが複数のページに適用することができます。スタイルシートの文書を変更する場合は、変更に必要に応じてページのスタイルシートファイルのスタイルへのすべての参照は、繰り返される作業の量を削減するだけでなく、後から変更する資する、編集、ダウンロードされたコードの回避の重複にも閲覧することができないだけ。スタイルシートファイルを編集し、延長の.cssに任意のテキストエディタを使用することができ、コンテンツは、スタイルシートを定義し、HTMLタグが含まれていません。

3.1インポート外部スタイルシート

外部スタイルシートを使用して、インポート・モードを導入し、導入された外部スタイルシート内のHTMLファイルヘッダの<style>要素で外部スタイルシートを導入することを指します。外部スタイルシートと外部スタイルシートと同様鎖に導入するが、内部パターンページに格納された外部スタイルシートをインポートすると実質的に等価です。

H1

{

テキスト整列：センター;中心配向へ/ *セット* /

}

P

{

行の高さ：1.5; / *行の高さを設定/

フォントサイズ：14px; / * *フォントサイズを設定/

}

 IMG

{

幅：120ピクセル

}

次のようにHTMLコードは次のとおりです。

<！DOCTYPE HTML >

< HTML >

< ヘッド>

< タイトル>輸入スタイルシート</ タイトル>

< スタイルタイプ= "テキスト/ cssの" >

@importのURL（ "あるstyle.css"）

</ スタイル>

</ ヘッド>

< 身体>

< H1の>夕暮れホイChongchun江</ H1の>

< P >

ピーチ三〇から二外竹

</ P >

< IMG SRC = "画像/ blossom.jpg" >

</ ボディ>

</ HTML >

2.リンク外部スタイルシート

外部スタイルシートファイルに保存されている外部スタイルのパターンにチェーンを参照し、スタイルシートファイル、ページの<head>要素内の<link>要素にリンクされているページの<link>要素を使用して。

<！DOCTYPE HTML>

<HTML>

<ヘッド>

<タイトル>輸入スタイルシート</ TITLE>

<スタイルタイプ= "テキスト/ cssの">

<リンクのhref = "style.cssに" のrel = "スタイルシート" タイプ= "テキスト/ cssの">

</スタイル>

</ head>の

<身体>

<H1>ホイChongchun江夕暮れ</ H1>

<P>

ピーチ三〇から二外竹

</ P>

<IMG SRC = "画像/ blossom.jpg">

</ BODY>

</ HTML>

おすすめ