HTML은 요소(Elements)로 구성되어있다.
태그 (Tag)
어떤 표시를 하기 위해 붙인 꼬리표
기본적으로 <>시작 태그 </>종료 태그 의 쌍으로 구성되어있다.
<p class="web-tech"> 웹의 대표적인 기술 HTML/CSS/JS </p>
요소의 포함
<p>
HTML은 요소 안에
<strong>다른 요소</strong>가 들어갈 수 있다.
</p>
<!-- 잘못 사용된 예 -->
<p>
HTML은 요소 안에
<strong>다른 요소 가 들어갈 수 있다.
</p>
</strong>
주의) HTML의 경우, 오류를 알려주지 않고 웹브라우저가 임의로 결과를 보여줌. -> '웬만한 오류는 알아서 처리해준다.' 의도치 않은 화면이 나올 수도있으니, 마크업 검사 필수.
https://validator.w3.org < 마크업 검사 사이트.
빈요소 / 셀프 클로징
닫는 태그가 없는 태그 존재.
<br>
<input type="text">
<img src="" alt="">
주석
<!-- 주석 내용 -->프로그램 동작에 영향을 미치지 않음.
설명하는 글을 적어두는곳.
매우 중요한 기밀 사항을 적어놓는 것은 X
태그의 시작과 끝을 적어놓는것이 좋음 (오류 체크하기에 good)
추가할 기능이나 임시로 처리해둔 곳 메모.
부모, 형제, 자식, 자손
부모 요소는 그 요소를 포함하는 가장 가까운 상위 요소.
자식 요소는 부모와 반대되며, 여러개.
조상 요소는 그 요소를 포함하는 모든 요소, 부모 포함 여러개.
자손 요소는 그 요소가 포함하고 있는 모든 요소.
형제 요소는 같은 부모를 가지고 있는 요소들.
<html>
<head></head>
<body>
<section>
<h1>
<strong></strong>
</h1>
<img>
<div>
<p><strong></strong></p>
<p><strong></strong></p>
<p><strong></strong></p>
</div>
</section>
</body>
</html>div을 기준으로 section은 부모.
div을 기준으로 html과 body, section는 조상.
div을 기준으로 h1과 img는 형제.
div을 기준으로 p는 자식
div을 기준으로 p와 strong은 자손
'HTML&CSS > HTML' 카테고리의 다른 글
| HTML(6) 표(table) (0) | 2023.08.19 |
|---|---|
| HTML(5) form (0) | 2023.08.19 |
| HTML(4) 태그 종류 (0) | 2023.08.19 |
| HTML(3) 블록 레벨 요소와 인라인 레벨 요소 (0) | 2023.08.19 |
| HTML(2) 문서해부 (0) | 2023.08.19 |