1. HTML

HTML(HyperText Markup Language)은 웹 페이지의 구조와 콘텐츠를 정의하기 위한 마크업 언어입니다. HTML은 웹 브라우저가 웹 페이지를 해석하고 표시하는 데 사용됩니다. 아래 예문을 통해 HTML의 기본 구조와 태그 사용 방법을 설명하겠습니다.

htmlCopy code<!DOCTYPE html>
<html>
<head>
    <title>My First Web Page</title>
</head>
<body>
    <h1>Welcome to My Web Page</h1>
    
    <p>This is a paragraph of text.</p>
    
    <ul>
        <li>Item 1</li>
        <li>Item 2</li>
        <li>Item 3</li>
    </ul>
    
    <img src="image.jpg" alt="My Image">
</body>
</html>

위의 예문은 간단한 HTML 문서입니다. 각 태그들은 다음과 같은 역할을 수행합니다:

  • <!DOCTYPE html>: 문서의 형식을 지정하는 선언으로, 이 경우 HTML5를 사용하고 있음을 나타냅니다.

  • <html>: HTML 문서의 루트 요소로, 모든 내용을 감싸는 역할을 합니다.

  • <head>: 문서의 메타 정보를 포함하는 요소로, 제목(title) 등의 정보를 정의합니다.

  • <title>: 웹 페이지의 제목을 정의합니다. 브라우저의 탭 제목이나 검색 결과에 표시됩니다.

  • <body>: 실제 웹 페이지의 내용을 포함하는 요소로, 브라우저에 표시되는 내용을 정의합니다.

  • <h1>: 제목(Heading)을 표시하는 요소로, 숫자가 커질수록 제목의 수준이 낮아집니다.

  • <p>: 문단(Paragraph)을 정의하는 요소로, 일반적인 텍스트를 포함합니다.

  • <ul>: 순서가 없는 목록(Unordered List)을 정의하는 요소입니다.

  • <li>: 목록의 항목(List Item)을 정의하는 요소입니다.

  • <img>: 이미지를 표시하는 요소로, src 속성을 통해 이미지 파일의 경로를 지정하고 alt 속성을 통해 대체 텍스트를 제공합니다.

이 예문을 통해 HTML은 태그들을 통해 웹 페이지의 구조와 콘텐츠를 정의할 수 있다는 것을 알 수 있습니다. 각 태그는 다른 기능을 가지고 있으며, 웹 페이지를 다양한 요소로 구성할 수 있습니다. HTML은 웹 개발의 기본이 되는 언어이며, 다양한 태그와 속성을 사용하여 웹 페이지를 구성하고 디자인할 수 있습니다.

Last updated