基本、備忘録です…
cssファイルの作成方法から、反映の方法のご紹介。
前章のHTML編、レイアウト・装飾でご紹介したcss…この章ではcssの用意〜使用例をご説明します。
また、考え方としては『記事』を『レイアウト』の中で、どの様に『装飾』するか…が、自然な流れだと思います。
出来るだけストーリーを考えてから取り組んで下さい。(もちろん順序に決まりはありません)
前章からの説明と多少重複しますが、cssとはカスケーティングスタイルシートと言いファイルの拡張子は『.css』です。
cssの記述方法は3通りありますが、外部ファイルを読み込む方法は1つだけです。
今回は『HTMLをキレイにすっきり書く』という目的のため、外部ファイルを読み込む方法を採用します。
作成したフォルダの中(index.htmlと同じ場所)にメモ帳を作成します。
作り方は『フォルダ内で右クリック⇒新規作成⇒テキストドキュメント』です。
また、この時ファイル名は『style2c.css』に変更して下さい。
<meta http-equiv="Content-Style-Type" content="text/css">
を前章で作成したindex.htmlの中の
<meta http-equiv="Content-Type" content="text/html; charset=shift_jis">
の下に記述しましょう。
意味は、そのページで使われているスタイルシート言語がCSSであるということを、ブラウザに伝えるためのものです。
<link rel="stylesheet" type="text/css" href="style2c.css" media="all">
を前章で作成したindex.htmlの中の
<meta name="description" content="ホームページを説明する文章……">
の下に記述しましょう。
意味は、スタイルシートとしてstyle2c.cssを読み込む、となります。
事項はcssの記述の仕組みから⇒cssを使ってみる