HTML 기본 문서 구조
HTML에서 태그는 <와 >를 이용해서 구분한다.
HTML은 대문자와 소문자를 구분하지 않지만, HTML5 표준 명세에서는 태그와 태그안에 사용하는 속성들은 모두 소문자로 사용할 것을 권장한다.
또한 HTML은 여는태그와 닫는태그가 있으며, 여는(시작)태그가 <h1>이면 </h1>으로 끝나야한다.
닫는게 필수적인 태그들은 대부분 자동완성을 지원하기 때문에 여러 코드를 짜면서 배우면 좋다.
비주얼 스튜디오 코드의 상단 메뉴에서 파일-새파일을 선택하면 빈문서 창이 열리는데 이걸 이용해서 저장하고 저장 단축키는 ctrl+s이다.
<!doctype html><!-- DTD : Document type declaration -->
<html lang="ko">
<head>
<meta charset='utf-8'>
<meta http-equiv='X-UA-Compatible' content='IE=edge'>
<title>내가 처음 만드는 HTML 문서</title>
<!-- <meta name='viewport' content='width=device-width, initial-scale=1'> -->
</head>
<body>
<h1>시간이란...</h1>
<p>내일 죽을 것처럼 오늘을 살고<br>영원히 살 것처럼
< 내일을 꿈꾸어라</p>
<!-- <는 왼쪽꺽쇠 >는 오른쪽꺽쇠 -->
<img src="images/first.jpg" alt="민들레 홀씨">
</body>
</html>
코드를 짜고 alt+b를 누르면 아래와 같은 화면이 뜬다 이미지는 따로 넣은 것이다.
코드를 보면 맨 위에<!doctype>이 있는데 이것은 문서 유형을 지정하는 선언문이다.
<html lang="ko">는 웹 문서 시작을 알리는 태그이다.
코드 | de | en | fr | ja | ko | zh |
언어 | 독일어 | 영어 | 프랑스어 | 일본어 | 한국어 | 중국어 |
ko위치에 이런 코드를 넣으면 해당 언어표기가 되는 것이다. 물론, 저 표시된 국가의 언어만 사용할 수 있는것은 아니나, 검색범위를 저 언어로 좁혀서 검색할때 좀 더 잘나온다.
문서의 대강의 틀을 결정하는 <head>태그안의 가장 중요한 태그중의 하나는 <title>이다.
<title> 문서제목 </title>로 쓰인다.
<meta> 태그 - 문자 세트를 비롯한 문서 정보