div는 가능한 모든 가로 면적을 100%활용하는 반면,
span은 최소한의 필요한 면적만 차지한다.
예시를 들어 확인해보면
width값을 지정하지 않았을 때, div와 span은 아래와 같이 나타난다.
코드(접은 글)
더보기
html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<div clsaa="box">div</div>
<span class="box">span</span>
</body>
</html>css
.box{
/*design*/
background-color: pink;
}| div | span |
 |
 |
div는 알아서 자리를 채워줘야 할 때 유용하고
span은 내용에 적합한 자리만 필요할 때 유용할 것이다
'html, css' 카테고리의 다른 글
| [html/css] flexbox (1) | 2023.10.17 |
|---|---|
| [html/css] 링크(새 창) 보안 문제 해결하기 (0) | 2023.10.17 |
| [html/css] css의 단위 (0) | 2023.10.16 |
| [html/css] Box Layout : border (0) | 2023.10.15 |
| [html/css] Box Layout : content, padding (0) | 2023.10.15 |
