• <div> vs <span>
구간을 나눈다는 공통점이 있음
<div>
block level element : 해당하는 코드의 행 전체를 차지
<span>
inline element : 자신의 content만큼만 공간 차지
<body>
<div>div부분</div>
<div>div부분</div>
<span>span부분</span>
<span>span부분</span>
</body>
위의 실행결과
사진과 같이 <div>는 줄 바꿈이 되지만
<span>은 줄바꿈이 되지 않는다.
• <br> vs <p>
줄바꾸기 기능을 한다는 공통점이 있음
<br> : 감쌀 필요 X, 닫는 태그 없음
강제 줄바꿈
<p> : 문단을 나타내는 태그
정보력을 가짐
<p>p태그 사용</p>
<p>p태그 사용</p>
br태그 사용<br>
br태그 사용<br>위의 실행결과
검색엔진은
<br> 태그를 단지 줄바꿈으로만 인식 -> 문장을 모두 하나의 단락으로 인식
<p> 태그는 문단으로 인식
=> <p> 태그 사용을 권장!
• <li>
<li> : list의 약자로, 목록을 만드는 태그
<ol>이나 <ul> 태그와 같이 사용됨
<ol> : Ordered list
순서가 있는 리스트
-> 자동으로 순서를 메겨줌
<ul> : Unordered list
순서가 없는 리스트
<ol>
<li><a href="1.html">HTML</a></li>
<li><a href="2.html">CSS</a></li>
<li><a href="3.html">JavaScript</a></li>
</ol>
<ul>
<li><a href="1.html">HTML</a></li>
<li><a href="2.html">CSS</a></li>
<li><a href="3.html">JavaScript</a></li>
</ul>위의 실행결과
