CSSまとめ①

・キャプチャー1まとめ

スタイルを指定するパーツをセレクタ

指定するやつとかはプロパティって呼ぶ。数値とは;で区切る感じ

難しいけど、ここでは〈div class=〉ってテンプレを覚えればおｋ

Q、「hello paiza」という見出しを表示したいな。headタグ上のstyleタグにスタイルを追加して、bodyの内側に30pxの余白を追加できる?

A、<style>body { padding: 30px; }</style>

・キャプチャー2まとめ

・演習1

Q、headタグのstyleタグにスタイル追加して、bodyの背景色を#D3D3D3 にして

A、プロパティ background-color
　　body {
　　　　background-color; #D3D3D3 ;
　　　}

・演習2

Q、headタグのstyleタグにスタイル追加して、見出し(h1)の色を(red)にできる?

A、プロパティ color
　h1 {
　　　color: red;
　　}

・キャプチャー3まとめ

・演習1

Q、headタグのstyleタグにスタイル追加して、pタグのウェイトをboldにしてね

A、プロパティ front-weight
　p {
　　　front-weight: bold;
　　}

・演習2

Q、headタグのstyleタグにスタイル追加して、h1タグのサイズを500%にできる?

A、プロパティ front-size
　h1 {
　　　front-size: 500% ;
　　}

・演習3

Q、headタグのstyleタグにスタイル追加して、h1タグのフォントをserifにできる?

A、プロパティ front-family
　h1 {
　　　front-family: serif;
　　}

・キャプチャー4まとめ

・演習1

Q、headタグのstyleタグにスタイル追加して、h1タグの枠線を追加できる?
設定値はsolid #00A0A0 で

A、borderプロパティ
　　h1 {
　　　border: solid #00A0A0 ;
　　}

・演習2

Q、headタグのstyleタグにスタイル追加して、bodyタグの内側に100pxの余白を追加できる?

A、padding プロパティ
　body {
　　　padding: 100px ;
　　}

・演習3

Q、headタグのstyleタグにスタイル追加して、h1タグの外側に80pxの余白を追加できる?

A、margin プロパティ
　　h1 {
　　　margin: 80px ;
　　}

・キャプチャー5まとめ

・演習1

Q、htmlのdivタグにcontainerってクラス追加お願い

A、〈div class=“container”〉

・演習2

Q、divタグにstarter-templateってクラス追加して、見出し周囲にstarter-templateのスタイル適用出来る?

A、〈div class="starter-template"〉
　　　　　〈h1〉hello paiza〈/h1〉
　　〈/div〉

・キャプチャー6まとめ

Q、3つの見出しもレイアウトを2:4:6の割合で表示して

A、〈div class="col-sm-それぞれの値"〉