[HTML] 기본적인 태그 블록 요소

2023. 3. 7. 00:29기술 창고/HTML

728x90
반응형
SMALL

HTML은 웹 페이지를 만들 때 틀이되는 구조라고 볼 수 있다.

<> 기호 안에 태그를 설정하여 구성할 수 있으며, 브라우저에서 그 틀을 확인할 수 있다.

기본적인 초기 태그 구성을 알아보자.

 

<!DOCTYPE html>
<html lang="ko">
    <head> 
        <meta charset="utf-8"> 
        <title>블록 요소 인라인 요소</title> 
    </head>
    <body> 
        <h1>블록 레벨 요소</h1>
        <p>블록 레벨 요소의 특징</p>
    </body>
</html>

<!--
    # 실행 후 개발자 도구를 통해 태그 블록의 요소들을 확인할 수 있다.
-->
  • <html> : 말 그대로 HTML 구조 임을 명시하는 태그이다. 가장 바깥 쪽에서 구현체들을 감싸고있는 wrapper 형태라고 볼 수 있다. lang 속성으로 한글 사용을 명시한다.
  • <head> : 타이틀, 설정 정보들을 import하는 태그.
  • <meta charset="utf-8"> : charset="utf-8" 로 텍스트 형식을 utf-8로 지정하는 태그.
  • <title> : 브라우저의 탭에 보이는 타이틀 태그.
  • <body> : 사실상 우리가 브라우저를 열었을 때 눈으로 바로 보이는 전체적인 내용 구조를 포함하는 태그.
  • <h1> : 제목 태그. 가장 큰 형태의 제목 태그이다.

 

# 실행 후 브라우저에서 확인한 결과

 

또한 실행 후 브라우저에서 오른쪽 마우스 버튼을 눌러 개발자 도구를 통해 만들어놓은 태그 블록들의 요소들을 확인할 수 있다.

728x90
반응형
LIST

'기술 창고 > HTML' 카테고리의 다른 글

[HTML] Heading 태그  (0) 2023.03.07
[HTML] 시멘틱 (semantic) 태그  (0) 2023.03.07
[HTML] div 태그로 그룹화  (0) 2023.03.07
[HTML] 텍스트 정의 요소들  (0) 2023.03.07
[HTML] 태그 블록 인라인 요소  (0) 2023.03.07