-本日のアジェンダ-
1限目
学科 HTML基礎⑤
ウェブフォントについて
2限目
学科 HTML基礎⑤
疑似クラスについて
3限目
学科 HTML基礎⑤
背景画像について
4限目
学科 HTML基礎⑤
floatプロパティでナビを作ろう(clearfix)
5限目
学科 HTML基礎⑤
本日のまとめ
本日のテーマ
CSSで見た目を変えましょう。
【復習】これまでのHTMLタグ（body内）
h1～ h6・ p ・ a ・img・ul( li)・ol( li)・ dl(dt・dd)・table(th・tr・td)
div ←ジョーカー
header・nav・main・section・footer
【復習】これまでのCSSプロパティ
color・background-color・font-size・width・margin・paddding ・display・float・clear ・content
【疑似要素】 :before・ :after
便利ツール
HTMLの記述をチェックしてみよう
Gateway – Another HTML Lint
CSSの記述をチェックしてみよう
CSS Validation Service
タグの意味等が思い出せない場合はこちらで調べてみよう
HTML5リファレンス
色の名前とカラーコードです
HTMLカラーコード: WEB色見本 原色大辞典
画像圧縮ツール
TinyJPG
ウェブフォント
ウェブフォントはウェブサーバ上に置かれたフォントデータを利用する仕組みなので、ユーザの閲覧環境に左右されません。
Googleが提供する無料のウェブフォントサービス「Google Fonts」を利用してみましょう。 （授業用PCのIllustrrator, Photoshopへのインストールはご遠慮ください。）
疑似クラス
対象の要素の状態や条件について、スタイルを指定するものです。
リンクテキストにポインターが乗ったら、テキストをの色を変える（:hover)等が有名です。