HTML 공부

jsbin.com/sozeyuyoto/edit?html,output

JS Bin

위 링크 들어가면 따로 프로그램 설치 없이 html을 바로바로 확인 가능한 페이지

 

 

html은 크게 2개로 분류됨

 

head - 빨간박스

UI 요소는 없음

인터넷에 검색할때 사용되는 title 이나 부가설명

그리고 북마크 추가할때 나오는 제목이나 아이콘 등을 정의함

즉 사용자에게 보여지는 것은 없고 상세설명으로 meta data 만 가지고 있다

 

body - 파란박스

사용자에게 보여지는 UI 적인 부분 아주 중요

위 이미지 보는 것과 같이 파란 박스 부분은 오른쪽 부분과 같이 바로 눈에 보여지게 됨

 

사용한 태그 설명은 하단과 같다

h1 => heading 큰글씨

h2 => heading2 작은 큰글씨

button => button 버튼

 

Web 공부 시, 밑에 링크 참고!!! 웹 docs임

HTML elements 로 들어가면 사용하는 tag 설명되어있음 꼭 보기 

developer.mozilla.org/ko/docs/Web/HTML

HTML: Hypertext Markup Language

하단 링크는 웹 구조 설명이니까 꼭 보기

developer.mozilla.org/en-US/docs/Learn/HTML/Introduction_to_HTML/Document_and_website_structure

Document and website structure

 

또한, html 하다가 잘 쳤는지 오류는 없는지 확인하고 싶다면 하단 링크 들어가서 

작성한 tag들을 복사해서 넣으면 어디서 문제가 있는지 말해줌

validator.w3.org/#validate_by_input

The W3C Markup Validation Service