-本日のアジェンダ-
1限目
学科 HTML/CSS基礎⑥
CSSの記述方法について
2限目
学科 HTML/CSS基礎⑥
CSSの記述方法について
3限目
学科 HTML/CSS基礎⑥
Webページ制作実践
4限目
学科 HTML/CSS基礎⑥
Webページ制作実践
5限目
学科 HTML/CSS基礎⑥
本日の講義のまとめ
本日のテーマ
CSSの記述をしましょう
メモ：
★＜要素 属性＝”属性値”＞
★セレクター｛
プロパティ：値；
｝
div.要素 {
width: 000px;
height: 000px;
background-color: ーーー;
}
★.class名 classの使い回し
CSS：マージン系プロパティ【復習】
- margin-top/-bottom/-left/-right プロパティ（マージン上下左右）
- margin プロパティ（マージン一括措定）
CSS：パディング系プロパティ【復習】
- padding-top/-bottom/-left/-right プロパティ（パディング上下左右）
- padding プロパティ（パディング一括指定）
@charset “utf-8”;
/* コメントアウト */
div.oya {
width: 500px;
height: 500px;
background-color: blue;
margin-left: 50px;
}
div.kodomo {
width: 200px;
height: 200px;
background-color: red;
margin-left: 50px;
}
★padding: 50px 0 0 50px; top right bottom left 時計回り
★margin: 50px 0 0 50px; top right bottom left 時計回り
★margin:0 auto 0 auto; ブラウザ中央配置（auto 自動中央配置）
★margin:0 auto; ブラウザ中央配置 （上下・左右）
★margin:0 0 0 auto;マージン 右配置
★margin-top: -50px; マイナスマージン（上に50減る）
★親子関係入れ子