さて、今日はCSSの記述場所についてです。
CSSを記述する場所は二つあります。
①CSSファイルに記述する
②HTMLファイル内に記述する
CSSファイルに記述する
「CSSファイル」とは、CSSだけをまとめて記述したファイルです。
テキストエディタで記述し、拡張子は「css」になります。
CSSファイルをHTMLファイルと関連付けることによって、
Webページ全体にスタイルが適用されます。
HTMLファイル内に記述する
HTMLファイルの<head>～</head>の間にCSSを記述します。
CSSを記述したHTMLファイルのみにスタイルが適用されます。
スタイルの優先順位
HTMLファイルにCSSファイルを関連付けし、
更にそのHTMLファイル内にCSSを記述した場合、
スタイルが重複する場合があります。
この場合、HTMLファイル内に記述したスタイルが優先されます。
例えば、
CSSファイルに”h2要素の文字色を赤にする”と記述した場合でも、
HTMLファイル内に”h2要素の文字色を青にする”と記述があれば、
h2要素の文字色は青色になります。
CSSを記述するときの注意点
【半角で入力する】
全角で記述してはいけません。
【大文字・小文字の区別はない】
英字の大文字、小文字の区別はないので、どちらで書いてもかまいません。
ただし、URLやフォント名などは本来の通りに記述をする必要があります。
【サポートされないプロパティもある】
ブラウザの種類、またはバージョンによっては、
サポートされないプロパティがあります。
サポートがされていない場合は、Webページが正しく表示されません。
現在勉強しているテキストでは、
HTMLファイルも自分で記述し、アップする形式なので、
CSSの記述場所が2通りありますが、
ホームページ作成ツールを使っている場合などは、
CSSファイルのみを追加する形になります。
どちらが正しい、ということはありませんが、
このページだけスタイルを変えたい！という場合意外は、
CSSファイルを関連付けするだけでよいと思います！
ちょっと余談…
今日、お客様からアメブロのCSS編集の依頼を受けました。
正直出来るか不安でしたが、
ご希望通りに対応することが出来ました！
勉強していることが仕事に役立った！という実感で
とても嬉しかった…という、私個人の出来事でした(笑)
自分のホームページのCSSを編集するようになると、
思い通りにスタイルが適用されたとき、本当に感動します！笑
是非皆様も少しずつ知識を付けて、
理想のページを作ってくださいね＾＾
【個人的なお話】
嵐が去って一気に暖かくなりましたね！
パーカーを羽織ると暑いくらいです。
花粉はスギからヒノキに移行したようですが、
私はどちらの花粉にも拒絶反応を起こしているようで、
今日も薬が手放せません…
この投稿は、以前運営していた同名のブログに当時書いたものを再掲載しています。
そのため、現在はデータがない画像などもあります。ご了承ください。
また、アフィリエイトやホームページの情報についてのブログですが、情報としても古いものが多いです。
過去の記事を改めて更新する予定はございませんので、ご承知おきください。