언어 & 기술 스택/HTML & CSS & JS
[HTML] 자주 사용하는 태그 (div, p, span 차이)
github.com/zlrloy
2023. 6. 29. 15:33
HTML에서 자주 사용하는 태그 참고
| 요소 | 내용 |
| <html> | |
| <head> | |
| <title> | 문서 제목 |
| <meta> | |
| <link> | 외부 리소스 연결 |
| <body> | 본문 |
| <script> | 외부 스크립트 포함할 때 사용하며 보통 JavaScript 코드와 함께 사용 |
| <h1> <h2> <h3> <h4> <h5> <h6> | 제목 |
| <a> | href 특성을 통해 다른 페이지를 url로 연결할 수 있는 하이퍼링크 (단독 사용x) |
| <img> | 이미지 삽입 |
| <br> | 줄바꿈 |
| <p> | block 요소|문단 |
| <div> | block 요소|class나 id 속성으로 꾸밀 수 있는 컨테이너 |
| <span> | inline 요소|특별한 기능은 없으며 CSS 적용시 사용 |
| <footer> | |
| <button> | 버튼 삽입 |
| <table> | 표 |
| <tr> | |
| <th> | |
| <td> | |
| <tbody> | |
| <thead> | |
| <ul> | 정렬되지 않은 목록 |
| <ol> | 숫자 목록 |
| <li> | 목록의 항목 |
| <input> | 데이터 입력 |
| <textarea> | 문장 입력 양식 |
그 중 헷갈리는 <div>, <span>, <p>
<p>는 하나의 문단을 나타냅니다.
<div> 순수 컨테이너입니다.
<span> 은 하나의 구문을 나타냅니다.
포함여부
div - p, span
p - span
span - x
