HTML 개요

기본 문법

요소(Elements)
<태그>내용</태그>
<시작(열린)태그>요소의내용(Contents)<종료(닫힌)태그>

부모와 자식 관계의 이해

부모 요소

<태그><태그>내용</태그></태그>

자식 요소

<태그><태그>내용</태그></태그>

Tab 들여쓰기 (Indent)
Shift +Tab 내어쓰기 (Outdent)

상위(조상)요소
나를 기준으로 감싸고 있는 모든 요소
하위(후손)요소
나를 기준으로 내가 감싸고 있는 모든 요소

빈 태그(=Empty)

<태그> vs </태그>

<태그>
편리함 (HTML1/2/3/4/5)

</태그>
안전함 (XHTML/HTML5)

<태그 속성="값">내용</태그>
기능의 확장
<img />
<input />

글자와 상자

요소가 화면에 출력되는 특성

• 인라인(Inline) 요소: 글자를 만들기 위한 요소들

  • 요소가 수평으로 쌓임
  • 줄바꿈하면 띄어쓰기 됨
  • 포함한 콘텐츠 크기만큼 자동으로 줄어듬
  • 인라인 요소 안에는 자식 요소로 블록 요소를 사용할 수 없음
    ex) span

• 블록(Block) 요소: 상자(레이아웃)를 만들기 위한 요소들

  • 요소가 수직으로 쌓임
  • 부모 요소의 크기만큼 자동으로 늘어남
    ex) div