너와 나의 개발 고리

[HTML] HTML의 기본 구성 요소 본문

CSS _HTML_JavaScript/HTML

[HTML] HTML의 기본 구성 요소

Oli-Viaaaa 2023. 6. 20. 00:07

태그

다양한 구성 요소를 정의하는 역할을 하며, HTML 문법을 이루는 가장 작은 단위이다.

기본 형식은 다음과 같이 홑화살표(<>)사이에 태그명을 넣는 형태이다.

<태그명>

 

속성

 

태그에 어떤 의미나 기능을 보충하는 역할을 하는데 옵션이라고 생각해도 된다.

속성은 사용해도 되고 안해도 되고 여러개를 사용해도 된다.

하지만 태그 없이 단독으로 사용할 순 없으며 아래와 같이 속성명과 속성값으로 구성된다.

<태그명 속성명="속성값">

<html lang ="ko">

만약 html 태그만 사용했다면 'HTML 문서의 시작' 이라는 의미만 있었으나

함께 사용한 lang 속성 때문에 태그의 원래 의미에 속성의 의미가 더해져

'주 언어(lang)가 한글(ko)로 된 HTML 문서의 시작' 이라는 구체적인 의미를 가지게 된다.

 

 

문법

HTML은 태그와 속성으로 문법을 구성한다. 그리고 문법은 콘텐츠(content)가 있는 문법과 콘텐츠가 없는 문법으로 나뉜다.

콘텐츠가 있는 문법에서는 위와 같이 콘텐츠 앞 뒤를 태그로 감싼다.

이때 앞에 넣는 태그를 시작태그(open tag), 뒤에 넣는 태그를 종료태그(close tag)라고 한다.

종료 태그는 태그명 앞에 슬래시(/)가 있다는 것만 다르고 시작 태그와 동일하다.

 

이 모든걸 합쳐서 요소(element)라고한다.

 

콘텐츠가 없는 문법은 앞뒤로 감싸야할 콘텐츠가 없으므로 시작 태그만 사용한다.

그래서 내용이 비어있다는 의미로 빈 태그(empty tag)라고도 한다.

콘텐츠가 없는 문법은 시작 태그가 곧 요소다.

 

 

주석

주석(comment)은 실행 결과(웹 브라우저)에는 표시되지 않지만 코드에 어떠한 메모나 설명을 남기고 싶을 때 사용한다.

<!-- 와 --> 사이의 내용을 작성하면 해당 내용은 주석으로 처리된다.

<!-- 주석 내용 -->

단 주석을 사용하면 웹 브라우저에는 아무것도 표시되지 않지만

웹 브라우저의 소스 보기로 볼 수 있으므로 보안상 중요한 내용을 넣으면 안된다.

'CSS _HTML_JavaScript > HTML' 카테고리의 다른 글

[HTML] HTML 링크와 이미지 넣기  (0) 2023.06.25
[HTML] HTML ul 태그의 스타일 변경(아이콘, 배열, 글자색, 크기, 글씨체, 배경색 변경)  (0) 2023.06.23
[HTML] 목록을 만드는 ul태그, ol태그, dl태그  (0) 2023.06.23
[HTML] HTML 텍스트 작성(hn 태그, p 태그, br 태그, blockquote 태그, q 태그, ins 태그, del 태그, sub태그, sup 태그, div 태그, span 태그)  (0) 2023.06.20
[HTML] HTML의 기본 구조  (0) 2023.06.20
'CSS _HTML_JavaScript/HTML' Related Articles more