HTML (HTML5)

<tag attribute="value">content<tag>

content + tag =element

HTML은 정적 페이지를 만드는 데만 사용할 수 있다. 따라서 사용자의 입력에 따라 동적으로 페이지를 변경해 제공하기 위해서는 JS를 사용해야 한다. HTML만 사용해서 처리하려면 사용자의 입력에 따라 변화한 페이지를 모두 HTML파일로 만들어 놓아야 한다.

HTML의 특징은 Hyper Text를 지원한다는 점. HTML 이전 : 페이지에서 다른 페이지로 이동하는 링크가 없었다. HTML : 페이지에서 다른 페이지로 링크를 타고 이동할 수 있다. HTML + JS : 사용자의 입력값에 따라 페이지에 변화를 줄 수 있다.

semantic

HTML을 작성할 때는 디자인 보다는 “의미”에 집중해야 한다. 디자인은 CSS로 처리한다. 그래서 아래 코드처럼 직접 inline으로 디자인해야 하는 경우 style attribute를 사용하는 편이 좋다.

<img src="aa" width=""/>
<img src="" style="width: "/>

id와 class

기본적으로 id는 유일해야 한다. 둘 이상을 묶어야 하는 경우는 class로 처리한다. id가 여러개 있어도 실행에는 문제가 없으나, 웹 표준을 어기게 된다.

HTML section layout

• - Defines a header for a document or a section
• - Defines a section in a document
• - Defines an independent self-contained article
• - Defines additional details
• - Defines a heading for the

  element
• 일반적으로는 section 안에 article을 넣지만, 반대로 article 안에 section을 넣는 경우도 있으니 참고할 것.
• 각각의 위치는 변경될 수 있음. body와 header의 구분은 간단히 유저 눈에 보이면 본문 즉 body이고, 안보이면 header에 넣어야 한다고 생각하면 된다.