728x90
반응형
<!DOCTYPE html>
<html lang="ko">
<head>
<title>display</title>
<meta charset="UTF-8">
<style>
div {
display: inline-block;
/* display : 요소 표시 상태 설정
none: 보이지 않고 공간도 차지하지 않음
block : 부모 요소의 가로 크기를 한줄 다 차지하게 된다.
inline: 필요한 만큼 공간 차지(width, height 안먹힘)
inline-block : 필요한 만큼 공간 차지(width, height 작동)
*/
}
div:nth-child(1) {
width: 100px;
height: 100px;
background-color: black;
}
div:nth-child(2) {
width: 100px;
height: 100px;
background-color: purple;
}
</style>
</head>
<body>
<div></div>
<div></div>
</body>
</html>
728x90
반응형
'정보 > WEB' 카테고리의 다른 글
| flex (0) | 2022.12.24 |
|---|---|
| filter(이미지나 요소에 효과주기) (0) | 2022.12.24 |
| cursor(커서모양) (0) | 2022.12.24 |
| color(색상) (0) | 2022.12.24 |
| box-sizing(박스크기) (0) | 2022.12.21 |