Border is literally border of the boxes.
<html>
<head>
<style>
* { everything
border: 1px solid white; width, style, color
}
html {
background-color: gray;
}
body {
margin: 0;
padding: 20px;
background-color: steelblue;
}
div {
padding: 25px;
}
#first {
background-color: rebeccapurple;
height: 150px;
width: 150px;
}
#second {
background-color: olive;
height: 100px;
width: 100px;
}
#third {
background-color: peru;
height: 50px;
width: 50px;
}
</style>
</head>
<body>
<div id="first">
<div id="second">
<div id="third"></div>
</div>
</div>
</body>
</html>
<html>
<head>
<style>
* {
border: 1px solid white;
}
html {
background-color: gray;
}
body {
margin: 0;
padding: 20px;
background-color: steelblue;
}
div {
padding: 25px;
}
#first {
background-color: rebeccapurple;
height: 150px;
width: 150px;
}
#second {
background-color: olive;
height: 100px;
width: 100px;
}
#third {
background-color: peru;
height: 50px;
width: 50px;
}
</style>
</head>
<body>
<div id="first">
<div id="second">
<div id="third">
<span>Hello!</span>
</div>
</div>
</div>
</body>
</html>
'HTML CSS' 카테고리의 다른 글
| KokoaTalk Clone Coding: classes (0) | 2021.05.03 |
|---|---|
| KokoaTalk Clone Coding: margin, padding (0) | 2021.05.03 |
| KokoaTalk Clone Coding: CSS padding 2 (0) | 2021.05.02 |
| KokoaTalk Clone Coding: CSS padding 1 (0) | 2021.05.02 |
| KokoaTalk Clone Coding: CSS collapsing margins (0) | 2021.05.02 |
