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>영원히 살 것처럼
        &lt; 내일을 꿈꾸어라</p>

        <!-- &lt;는 왼쪽꺽쇠 &gt;는 오른쪽꺽쇠 -->
    <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> 태그 - 문자 세트를 비롯한 문서 정보

+ Recent posts