기본 문법
태그(Tag)
HTML에서 태그는 꺾쇠를 사용하는 문법임
일반적으로 시작 태그와 종료 태그로 내용을 감쌈
시작 태그는 <태그 이름> 형태로 쓰고 종료 태그는 </태그 이름>으로 씀
<img src="https://example.com/my-image.png" />위와 같은 이미지 코드도 올바른 문법임
속성
시작 태그에 속성 이름="속성 값" 형태로 사용하는 문법임
태그의 속성을 저함
HTML 파일의 기본 구조
맨 윗줄에는 이 파일이 HTML 문법을 쓴다는 걸 알려주는 코드가 들어감 = <!DOCTYPE html>
그 아래로는 크게 <html> 태그로 감싼 다음에, <head> 태그와 <body> 태그로 나눔
이때 <head> 태그 안에는 페이지에 대한 정보가 들어가고, <body> 에는 페이지 내용이 들어감
배운 태그 정리
사이트 이름
웹 브라우저 탭이나 창에 보이는 제목을 정할 수 있음
<head>
<title>윤동주 서시 - 한국 시 모음</title>
...
</head>
인코딩 정하기
한글을 지원하는 인코딩인 UTF-8을 사용하도록 정하는 코드
<meta> 태그를 사용해서 <head> 태그 안에 넣어 주면 됨
<head>
<meta charset="utf-8">
...
</head>
제목
제목(Heading)은 제일 큰 것부터 작은 것까지 <h1>, <h2>, ..., <h6> 태그를 사용할 수 있음
단락
단락(Paragraph)은 <p> 태그로 감싸면 됨
줄바꿈
HTML은 기본적으로 문장들을 이어서 보여줌
줄바꿈(Break Line)은 <br>이라는 태그를 사용함
링크
링크는 <a> 태그를 사용함
href 속성으로 이동할 주소나 경로를 적어 주면 됨
이미지
이미지는 <img> 태그를 사용함
src 속성으로 이미지 파일의 주소나 경로를 적어 주면 됨
영역 나누기
<div> 태그로 여러 태그를 감싸거나, <span> 태그로 텍스트 일부만 감쌀 수 있음
'CODEIT;' 카테고리의 다른 글
| 웹 퍼블리싱 시작하기 : 오픈그래프로 소셜 공유 미리보기 만들기 (0) | 2023.08.27 |
|---|---|
| 웹 퍼블리싱 시작하기 : CSS 기본 문법 (0) | 2023.08.27 |
| 웹 퍼블리싱 시작하기 : HTML 코드를 편하게 입력하는 법 (0) | 2023.08.25 |
| 웹 퍼블리싱 시작하기 : HTML 꺾쇠 기호 넣는 법 (0) | 2023.08.25 |
| 웹 퍼블리싱 시작하기 : 수업 소개 (0) | 2023.08.24 |