HTML에 대하여

• HTML → 웹페이지의 구조
• CSS → 스타일시트 언어, 웹페이지의 디자인을 다룸
• JS → 상호 작용, 웹페이지의 기능

HTML

• 문서의 구조 혹은 내용을 다루는 언어
• 웹페이지의 틀을 만든다.
• 태그<> 의 집합.
• HTML의 구조처럼 자식의 자식으로 뻗어나가는 구조를 트리구조라고 한다.

Self Closing Tag

• 닫는 태그 없이 사용되는 태그로 빈 태그라고도 한다.
  → img 태그 등
• <태그이름 /> 으로 마지막에 / 를 붙혀 닫힘을 표현해주거나, 생략 할 수 있다.

자주사용 되는 태그들

div

• 한줄을 전부 차지한다. (block)

span

• 컨텐츠만큼만 자리를 차지한다. (inline)

img

• src 속성을 이용하여 이미지를 삽입한다.

a

• href 속성을 이용하여 링크를 연결하며, 추가 속성을 이용해서 페이지가 열릴 방법을 지정해 줄 수 있다.
  (target="_blank)

ul, li

• 리스트를 만드는 태그로, ul(unordered list) 의 자식으로 li 를 포함한다.
  (ol 로 li 를 감싸는 경우 리스트의 순서를 숫자로 표현 할 수 있다.)

input

• 입력폼을 만드는 태그
• type 속성을 변경하여 입력받는 모양을 변경 할 수 있다.
  textbox, checkbox, radio 등
• checkbox 와 radio 의 차이 → checkbox는 중복선택, radio 는 하나만 선택가능.(그룹으로 묶임)
• radio 는 name 이라는 속성을 이용하여 같은 그룹으로 지정해 줄 수 있다.

textarea

• 입력박스를 만드는 태그
• 한줄 이상의 텍스트를 작성 할 수 있다.

button

• 누를 수 있는 버튼을 만든다.

+

• HTML의 속성은 attribute, CSS의 속성은 property
• section 태그는 제목태그<h1~6>를 포함해야하며, 같은 주제를 가진 컨텐츠를 그룹화 할때 명시적으로 사용한다.
• 스타일 혹은 스크립트의 편의성을 위해 사용해야 한다면, 명시적인 의미가 없는 div를 사용해야 한다.