* 이 게시물은 HTML5 웹프로그래밍 입문 3판-한빛아카데미 책을 기반으로 작성됩니다*
* 스스로 공부하고 복습하는 개념으로 정리하는 것이기에 부족한 부분이 있을 수도 있습니다!*
오늘은 HTML5 페이지 구조에 대해서 알아보고자 합니다!
처음 구조를 보면 어렵다고 느낄 수 도 있지만 실습을 통해 보면 크게 어렵지는 않을 겁니다.
모든 html5 페이지는 크게 다음 구조로 작성합니다.
<!DOCTYPE html> //웹 브라우저에 HTML5문서라고 알리기 위해 반드시 첫 행에 작성해줍니다.
<head> // body 태그에 필요한 스타일시트와 자바스크립트를 제공합니다.
<title>Hello HTML5 </title> // <title>은 웹 브라우저에 표시하는 제목을 지정해주는 태그입니다.
</head>
<body>
// 실제로 보이는 부분을 작성하는 부분입니다.
</body>
</head>
1. 스타일시트 작성과 실행
웹 페이지는 두 가지 방법의 스타일시트를 사용해 스타일을 적용하게 됩니다.
하나는 HTML 페이지 내부에서 style이라는 태그를 이용해 스타일시트를 직접 입력하는 내부 스타일 방법이고 다른 하나는 스타일시트를 별도의 파일로 만든 후에 HTML 페이지 내부에서 link 태그의 href속성을 사용해 스타일시트를 불러오는 외부 스타일 방법입니다.
2. 자바스크립트 작성과 실행
자바스크립트도 스타일시트처럼 script 태그를 사용해 내부에서 작성하거나 script 태그의 src 속성을 사용해 외부에서 불러오도록 작성가능합니다. 하지만 주로 외부 자바스크립트로 작성하는 경우가 많다고합니다.
외부 파일을 추가할 때 혼란스러울 수 있으나 외부 스타일시트는 link 태그를 사용하고, 외부 자바스크립트는 script 태그르 사용한다는 것을 꼭 기억해주세용!
'공부 자료 > 웹프로그래밍' 카테고리의 다른 글
| CSS3 기초: 선택자와 단위 (0) | 2021.01.21 |
|---|---|
| HTML5 입력 양식 태그와 구조화 태그 (0) | 2021.01.17 |
| HTML5 기본 태그 (0) | 2021.01.06 |
| 웹 페이지 기본 구조와 작성 방법- HTML5 기본 용어 (0) | 2021.01.05 |
| HTML5 웹프로그래밍 입문 (0) | 2021.01.05 |