Inline: They allow anything next to them.(in the same line, etc. span, a, image)
Block: They don't.(do not have height, width)
<head>
<style>
div {
height: 100px;
width: 100px;
background-color: thistle;
}
span {
background-color: skyblue;
}
</style>
</head>
<body>
<div></div>
<div></div>
<div></div>
<span>Hello!</span>
<span>Hello!</span>
<span>Hello!</span>
</body>
<head>
<style>
div {
height: 100px;
width: 100px;
background-color: thistle;
}
span {
display: block;
background-color: skyblue;
}
</style>
</head>
<body>
<div></div>
<div></div>
<div></div>
<span>Hello!</span>
<span>Hello!</span>
<span>Hello!</span>
</body>
'HTML CSS' 카테고리의 다른 글
KokoaTalk Clone Coding: CSS collapsing margins (0) | 2021.05.02 |
---|---|
KokoaTalk Clone Coding: CSS margin (0) | 2021.05.02 |
KokoaTalk Clone Coding: How to add CSS to HTML (0) | 2021.05.02 |
KokoaTalk clone coding: HTML more tags (0) | 2021.05.02 |
KokoaTalk clone coding: HTML form tags (0) | 2021.04.30 |