CSSとはなんぞや

以前”HTMLとはなんぞや”の記事でWebサイトのほとんどが「HTML」と「CSS」からできている...的なことを言っていたのだが、「CSS」について触れていなかったのでこちらで分かったこと、理解できたことを共有しようと思う。

cantera45.hatenablog.com

CSSとは、HTMLで表示させたものを加工する...例えば、色、背景、文字の大きさ、表示位置、アニメーションなどなど。つまり、HTMLのみで作られたホームページをより華やかに、簡潔に、見やすくするための言語という捉え方で間違っていないと思う。

 

これまで(この記事も含む)の私のブログを見てもらえばわかると思うが、あれはHTMLのみ(はてなで編集できる部分に限る)で表記されている。どうだろう、お世辞にも見やすいとは言えないと思う。私もそう思う。

これでもはてなブログ側から用意されているテンプレートを使っているので、フォントが変わっていたり、背景色が白じゃなかったり、文字の大きさが調整されていたり…と見やすい処置が施されているのだ。

 

何が言いたいかというと、HTMLのみから作るサイトは見づらいものしか作れないのではないだろうか?(つまりは、CSSの学習は必須…)

 

ホームページを作る。これはかなり学習の必要な領域になりそうだ。

今はHTMLのメモ帳みたいなものを作っているが、CSSについてのメモ帳なんかも作っていこうと思った。

cantera45.hatenablog.com

肝心なCSSの内容がどんなものかについて触れていなかったので、まとめてみる。

まずは<link rel=”stylesheet”href=”try.css”>を作成したHTMLの<head>の中に追加して

 

h1{color:red}

これだけを.cssの拡張子で保存(メモ帳とかでヨシ)して、追加したHTMLをブラウザで開けば見出しが赤くなっているという…

 

あれ?思ったより難しくなくない?

テンプレとして渡すだけだから、それぞれの見出し一つ一つに設定入力しなきゃいけないわけでもないし、別ファイルから書き込むから文字がたくさんある中で作業をしなくて済むし...自分のページのスタイルを確立してしまえば、大きく書き換えずに次のサイトにも使えるし……

やばくね?神使用じゃん。

覚えよ。

これから学習していくから興味があったら一緒に学習していこうね(*'▽')