소근소근

[HTML] div, span 태그 차이 본문

HTML,CSS,Javascript

[HTML] div, span 태그 차이

JJureng 2021. 8. 18. 21:06
728x90
반응형
SMALL
728x90

div 와 span태그는 웹 페이지에서 영역을 지정할 때 사용하는 태그이다.

 

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>div&span</title>
</head>
<body>
    <div>div1</div>
    <div>div2</div>
    <br /><br />
    <span>span1</span>
    <span>span2</span>
</body>
</html>

div의 경우 자동으로 줄바꿈이 되지만 span은 한 줄에 같이 나오는 것을 볼 수 있다.

 

이유는 div의 경우 block 속성, span은 inline 속성을 갖기 때문이다. 

이러한 특성을 사용해서 한 줄만 디자인을 바꾼다거나 할 수 있다.

 

728x90
반응형
LIST

'HTML,CSS,Javascript' 카테고리의 다른 글

[Javascript] How Javascript works? 자바스크립트의 동작 원리 , 엔진, 런타임 , 호출 스택  (0) 2021.09.08
[Javascript] object reference , shallow / deep cloning 객체 참조 복사 / 값 복사  (0) 2021.09.07
[HTML] form tag 예제  (5) 2021.08.18
[HTML] form 태그 method 속성  (2) 2021.08.18
웹의 역사 (History of the Web)  (0) 2021.08.15
'HTML,CSS,Javascript' Related Articles more