HTML(Hypertext Markup Language)은 인터넷의 중추입니다. 웹페이지의 콘텐츠를 구성하는 데 사용되는 마크업 언어입니다. 자신만의 웹사이트를 만들고자 하는 사람이라면 HTML의 기본을 이해하는 것이 필수적입니다. 이 초보자 가이드에서는 HTML 문서의 기본 구조부터 일반적으로 사용되는 중요한 태그와 요소까지 HTML의 기본 사항을 살펴보겠습니다.
HTML 문서의 구조
모든 HTML 문서는 사용되는 HTML 버전을 지정하는 doctype 선언으로 시작됩니다. 그 다음에는 웹페이지의 전체 콘텐츠를 둘러싸는 여는 HTML 태그와 닫는 HTML 태그가 옵니다. HTML 태그에는 머리글과 본문이라는 두 가지 주요 섹션이 있습니다. 헤드 섹션에는 제목, 문자 인코딩, 연결된 스타일시트 등 문서에 대한 메타데이터가 포함되어 있습니다. 본문 섹션에는 웹페이지의 표시되는 콘텐츠가 포함됩니다.
HTML 태그 및 요소
HTML 태그는 웹페이지의 다양한 부분을 마크업하고 구조와 의미를 부여하는 데 사용됩니다. 태그는 꺾쇠괄호 로 묶여 있습니다. 여는 태그가 먼저 기록되고 그 다음 내용, 닫는 태그가 기록됩니다. 예를 들어 단락 태그는
…
로 작성됩니다. 일반적으로 사용되는 일부 HTML 요소에는 제목(
~
), 단락(
), 링크(), 이미지(), 목록(
- ,
- ,
- ) 및 테이블(
,
, )이 있습니다. 이러한 요소를 사용하면 콘텐츠의 형식을 효과적으로 지정하고 구성할 수 있습니다. 속성 및 값
HTML 속성은 요소에 대한 추가 정보를 제공하며 여는 태그 안에 배치됩니다. 이름-값 쌍으로 작성됩니다. 예를 들어 태그는 href 속성을 사용하여 링크의 URL을 지정합니다. 속성을 사용하여 요소의 모양, 동작 또는 기능을 변경할 수 있습니다. 몇 가지 일반적인 속성에는 class, id, style, src 및 alt가 포함됩니다.
형식 및 스타일링
웹페이지에 시각적 스타일과 서식을 추가하기 위해 HTML과 함께 CSS(Cascading Style Sheets)가 사용됩니다. CSS를 사용하면 웹페이지의 색상, 글꼴, 여백 및 레이아웃을 제어할 수 있습니다. 각 HTML 요소에 스타일 속성을 추가하여 인라인 스타일을 사용하거나 태그를 사용하여 외부 스타일시트를 연결할 수 있습니다. CSS 선택자는 특정 요소를 대상으로 하고 해당 요소에 스타일을 적용하는 데 사용됩니다.
콘텐츠 추가
웹페이지를 만들 때 텍스트, 이미지, 링크, 동영상 등 다양한 유형의 콘텐츠를 추가하고 싶을 것입니다. 단락에는
태그를, 제목에는
~
태그를 사용하여 텍스트를 추가할 수 있습니다. 이미지는 src 속성으로 지정된 소스와 함께
태그를 사용하여 삽입할 수 있습니다. 링크는 URL 대상을 정의하는 href 속성과 함께 태그를 사용하여 생성됩니다.