<style>
body {
background-color: cornflowerblue;
margin: 10px 20px 100px 100px;
}
#a {
background-color: rgb(219, 129, 25);
width: 200px;
height: 200px;
}
#b {
background-color: rgb(39, 59, 150);
width: 150px;
height: 150px;
}
#c {
background-color: rgb(192, 25, 164);
width: 100px;
height: 100px;
}
#d {
background-color: rgb(158, 129, 14);
width: 50px;
height: 50px;
}
#e {
background-color: royalblue;
width: 10px;
height: 10px;
}
</style>
</head>
<body>
<h1>This is website</h1>
<div id="a">
<div id="b">
<div id="c">
<div id="d">
<div id="e"></div>
</div>
</div>
</div>
</div>
</body>
div {
padding: 10px;
}
//위 코드에 padding 10px 추가
id 값을 여러개 주어 각각의 속성을 넣을 수 있음.
- {} 를 통해 전체 css 속성 부여 가능.
padding 값을 변경했는데 박스 사이즈가 커진게 뭐지 이해 안간다.