반응형
HTML 기초 학습 가이드
HTML이란?
HTML(HyperText Markup Language)은 웹 페이지를 구성하는 기본 언어입니다. 웹 브라우저가 이해할 수 있는 형태로 문서를 작성하게 해주며, 텍스트, 이미지, 링크, 표, 리스트 등 다양한 요소를 표현할 수 있습니다.
HTML 문서의 구조
HTML 문서는 보통 아래와 같은 기본 구조를 가집니다.
<!DOCTYPE html>
<html>
<head>
<title>제목</title>
</head>
<body>
<!-- 내용 -->
</body>
</html><!DOCTYPE html>: 문서 타입을 HTML5로 지정합니다.<html>: HTML 문서의 시작과 끝을 표시합니다.<head>: 문서의 메타 정보나 스크립트, 스타일 등을 포함합니다.<title>: 웹 브라우저의 탭에 표시되는 제목을 설정합니다.<body>: 웹 페이지의 실제 내용을 포함합니다.
주요 HTML 태그
- 제목 태그:
<h1>,<h2>,<h3>등 제목을 표시합니다. - 단락 태그:
<p>단락을 만듭니다. - 링크 태그:
<a href="URL">링크를 생성합니다. - 이미지 태그:
<img src="이미지 경로">이미지를 삽입합니다. - 목록 태그:
<ul>과<ol>로 목록을 만들고,<li>로 항목을 추가합니다. - 표 태그:
<table>,<tr>,<td>등을 사용하여 표를 만듭니다.
예제 코드
HTML 파일 작성하기
- 텍스트 에디터(Notepad, Visual Studio Code 등)를 열고 HTML 코드를 작성합니다.
- 파일을
.html확장자로 저장합니다. 예:index.html - 웹 브라우저에서 해당 파일을 열면 HTML 페이지가 표시됩니다.
마무리
HTML은 웹 페이지를 만들기 위한 필수적인 요소입니다. 태그를 사용하여 다양한 형태와 기능의 웹 페이지를 만들 수 있습니다. 이 글을 통해 HTML의 기본적인 개념과 사용 방법을 학습했습니다.
반응형
'도서로 공부하는 프로그래밍 > 코딩 자율학습' 카테고리의 다른 글
| [HTML] HTML에서 목록과 표 다루기 (8) | 2023.10.31 |
|---|---|
| [HTML] HTML의 텍스트 관련 태그 (57) | 2023.10.30 |
| [전자책 만들기] 리눅스에서 전자책 편집기 'Sigil' 사용법 (60) | 2023.10.28 |
| [Python] Python에서 `import` 사용하기 (74) | 2023.10.19 |
| [Python] Python에서 주석 사용하기 (79) | 2023.10.18 |
