#10ゼロからwebの基本「HTML」「CSS」編 〜10日目〜 『CSSを少しだけ使ってみる』
「こんばんは」あるいは「おはようございます」それとも「こんにちは」
ゆーたろです。
今日も一緒に勉強して行きましょう。
今回は本来なら他の要素もやる予定だったのですが、まだ自分の理解が追いついてないので
予定変更をして今日は少しだけCSSを使ってみましょう！
- CSSを少しだけ使ってみよう
前回まで作ってきた物のブラウザのウィンドウを変更してみましょう。
合わせて段落の幅も変わって来ます。
そうする事によって段落の幅を固定でき、読みやすくすることが出来ますね！
早速下の様にHTML要素ではなく、（CSS)スタイルシートを使います。
<style>〜</style>の内容を<head>〜</head>の中に入力してみてください。
保存してブラウザでプレビューしてみます。
画像ではわかりにくいですが本文がブラウザウィンドウの80％幅になりました。
ついでに文字色も指定しているのでグレーになっています。
※＃の数字のところを色番号などを見て変えると他の色にも出来ますし、
80％の所の数字を変えればブラウザウィンドウの幅も変えることが出来ます。
ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー
ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー
今回はCSSでスタイルはするということをやってみたかったので
<head>要素の中に直接書く方法を使いましたが、CSSは HTML上に書かずに 独立したCSSファイル にして読み込む方法が標準の様です。
- 最後に
今日はすごく短くなってしまいすみません。
仕事と家事の間時間で勉強しているので、極端に時間が取れない日は
今日の様な事になってしまうかも知れないです。
次回 →次こそは<div>・<span>要素をCSSを取り入れつつやって行きましょう。
