[JS & HTML] 선긋기 태그

Posted by nkjok
2025. 2. 16. 20:10 낙서장[1]/92. JS & HTML
반응형

HTML (HyperText Markup Language)

HTML은 웹 페이지의 구조를 정의하는 마크업 언어입니다. 이 코드는 HTML의 기본 구성 요소를 포함하여 웹 페이지의 구조를 설정합니다.

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>웹 페이지의 구성 요소</title>
</head>
<body>
    <h3>Elvis Presley</h3>
    <hr>
    He was an American singer and actor. In November 1956, he made his film debut in <span> Love Me Tender </span>
    He is often referred to as "<span> the King of Rock and Roll </span>"
</body>
</html>

주요 구성 요소:

  1. DOCTYPE 선언:DOCTYPE 선언은 문서 형식을 HTML5로 지정합니다.
    <!DOCTYPE html>
    
  2. html 요소:<html> 요소는 웹 페이지의 루트 요소입니다. lang 속성은 문서의 언어를 지정합니다.
    <html lang="en">
    
  3. head 요소:<head> 요소는 메타데이터를 포함하며, 문서 제목과 문자 인코딩, 뷰포트 설정을 정의합니다.
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>웹 페이지의 구성 요소</title>
    </head>
    
  4. body 요소:<body> 요소는 실제 콘텐츠를 포함합니다. 이 코드에서는 제목(h3 요소), 수평선(hr 요소), 문장 및 강조 텍스트(span 요소)를 포함합니다.
    <body>
        <h3>Elvis Presley</h3>
        <hr> 
        He was an American singer and actor. In November 1956, he made his film debut in <span> Love Me Tender </span>
        He is often referred to as "<span> the King of Rock and Roll </span>"
    </body>
    

사용된 요소들

  1. <h3> 요소: 제목 3 수준의 헤더를 나타내며, "Elvis Presley"를 표시합니다.
  2. <hr> 요소: 수평선을 그어 내용을 구분합니다.
  3. <span> 요소: 인라인 컨테이너로 특정 텍스트를 강조하거나 스타일을 적용할 수 있습니다.

이 코드는 엘비스 프레슬리(Elvis Presley)에 대한 간단한 웹 페이지를 구성하며, HTML의 기본적인 구조와 요소를 활용하여 웹 페이지를 작성하는 예시입니다.

반응형