footer東京都を拠点にしたWebサイト制作。公開HTMLができたら次は装飾を施すためにCSSを学んでいきましょう。Sheet)の略で、HTMLで作成したデータに対しスタイルを指定して色や形を変更するための言語です。HTMLに対しての言語なのでCSS単体では意味を持ちません。別にする必要があるのか?HTMLに全部スタイルも書いてしまえばラクじゃないか?なぜわざわざスタイルを分ける必要があるのか?実はまだHTMLの歴史が浅い頃はHTMLファイルにスタイルを定義するタグがありました。<center>、<i>、<big>などがそうでした。これが次第に「HTMLはコンテンツの中身として、見栄えやスタイルは新しくCSSにまとめよう」という動きになりました。すればコンテンツをいじらずデザインを変えることができます。膨大に増え続けるウェブページを効率よく検索ロボットがクロールするためというのもあります。今までのHTMLとはちょっと書き方が変わります。}図で説明するとこんな感じです。先ほどの例を説明すると「h1というHTMLタグに対してフォントの大きさを20pxにしてください」という命令になります。基本のCSSは以下のような型になります。}これでも間違いではないですが、h1が2回表示されているので効率悪いですよね。そこで同じセレクタはまとめてしまいましょう。}これで1つのセレクタに2つのプロパティと値のセットが書け、無事h1はフォントが大きくなり色も赤くなりました。こんな感じで一つのセレクタに複数のプロパティを書いていくので例えば10個とかプロパティを書くと「どれがプロパティでどれが値か」わかりづらい。いう感じに見難いCSSになってしまいます。left;}そこでこれをもう少し見やすくしてみましょう。left;}こうするとかなり見やすくなりました。基本的にはこのようにプロパティの前に「改行と隙間」をあけてあげ、セレクタに対し入れ子構造で書いてあげると視認性も上がり書きやすく読みやすいCSSファイルが出来上がります。ちなみにこの隙間は「スペース」であけてもいいですが、「タブキー」を使って開けてあげるのが一般的です。まとめCSSには「セレクタ、プロパティ、値」の3種類があって、セレクタはHTMLやid名、Class名など、プロパティはそのターゲットをどうするか、値はプロパティの数値やジャンルなどを決めることでCSSが定義されるというのを学びました。「HTMLの次にCSSも学ばないとなのか...」と思うかもしれませんが、HTMLをここまで学んできているのでそこまで難しくは無いはずです。CSSの楽しみを覚えると感覚で組み立てていけるのでかなり楽しく感じれるようになります。プロパティと値はたくさん種類があって覚えようとなるとかなりキツイ作業なのでやりながら覚えていきましょう。全部暗記する必要はないです。次回以降メインで使うプロパティをピックアップして解説します。プロモーション業務などを行う。2012年にハイファイブクリエイトを創業し、現在はディレクションや開発業務などを担当している。