w3c markup validation service
학습목표
-태그, 요소, 속성의 의미를 이해합니다.
-HTML 태그, CSS, 자바스크립트를 사용해 웹 페이지를 작성하는 방법을 익힙니다.
-검사로 디버그하는 방법을 알아봅니다.
1. html5 기본 용어_ 태그, 요소, 속성
요소(element)는 좁게는 브라우저 상에서 보이는 제목, 본문, 이미지를 이야기 하고 넓게는 브라우저상에서의 모습은 물론, html문서상에서 작성되는 제목, 본문, 이미지, 시작태그(start tag)와 끝태그(end tag), 그리고 사이에 들어가는 내용 등 html 페이지를 구성하는 모든 것을 말합니다. 자바스크립트에서는 객체(object)라고도 합니다.
태그(tag)는 이러한 요소 중 제목, 본문, 이미지를 브라우저 상에서 보이게 하고, html문서 상에서 묶고 만들어내는 작성 방법이라고 할 수 있습니다.
1) 태그와 요소
요소는 내용을 가지냐 아니냐에 따로 두가지로 나누어집니다.
위의 생성방법에 따른 요소 구분의 예시에서 본 것처럼 태그는 내용이라는 요소를 감쌀 수 있습니다.
태그 안에 들어갈 수 있는 내용은 텍스트, 다른 태그, 내용없음의 세가지가 있습니다.
사실 그냥 간단하게 말하자면 요소들을 묶는 것이 태그이고 이러한 태그와 요소는 빈태그냐 아니냐에 따라 모습이 달라집니다. 빈태그로 쓸 수 있는 태그는 <br> <img> 등이 있습니다.
2) 속성(attribute)
속성은 태그에 추가 정보나 기능을 넣을 수 있게 해줍니다.
띄어쓰기 오류를 제거하기 위해 따옴표("")사용
https://dasima.xyz/html-attribute-quote/
2. 주석
<!-- 뭐라 적고 -->
// '--'를 html 내부에서 사용하게 되면 오류가 날 수 있으므로 사용하지 않는 것을 권장한다.
cf. '--' 를 표기하는 문자 엔티티는 존재하지 않는다.
3. html5의 구조
html은 <html></html>안에 작성되며 <head>와 <body>로 구성된다.
// html5문서의 첫행에 !Doctype html을 표기하는 이유 : 호환성 문제 때문에
//Doctype : 문서유형정의(DocumentTypeDefinition)를 위해 사용하는 선언문으로 사용
//관련자료 : https://velog.io/@yunsungyang-omc/HTML-DOCTYPE
'대학강의정리 > 22.1 웹프로그래밍기초' 카테고리의 다른 글
| 2. html5 기본태그 중 글자태그 (0) | 2022.04.19 |
|---|---|
| 1. 웹 디버깅하기 (0) | 2022.04.18 |
| 1. html5페이지의 구조, 태그의 종류 (0) | 2022.04.18 |
| 0. 웹 동작과 웹 표준 기술, html5 (0) | 2022.04.16 |
| 0강. 웹 개요와 실습환경 구축 (0) | 2022.04.16 |
