-会員ページFree-CSS基礎構文-練習問題2-


View Modeで閲覧

■CSS基礎構文-練習問題2-ビデオ1
作成するページを見てみましょう!

■【解説】CSS基礎構文-練習問題2-ビデオ2
div要素に背景色をつけましょう!

■【解説】CSS基礎構文-練習問題2-ビデオ3
div要素にサイズを指定し、インラインブロック要素を指定しましょう!

■MDN CSSリファレンス
https://developer.mozilla.org/ja/docs/Web/CSS

「ブラウザ」と「エディタ」は下記のWebページからダウンロードできます。

■Google Chrome (ウェブブラウザ)
https://www.google.com/intl/ja_ALL/chrome/

■Atom (テキストエディタ)
https://atom.io/

index.html

<!DOCTYPE html>
<html lang=”ja”>
<head>
<meta charset=”utf-8″>
<title></title>
<style>

.box1 {
background: red;
}
.box2 {
background: green;
}
.box3 {
background: blue;
}
.box4 {
background: pink;
}

.box1,
.box2,
.box3,
.box4 {
width: 200px;
height: 200px;
display: inline-block;
}

</style>
</head>
<body>

<div class=”box1″>box1</div>
<div class=”box2″>box2</div>
<div class=”box3″>box3</div>
<div class=”box4″>box4</div>

</body>
</html>