HTML에 쓰이는 TAG들 중 사용 빈도가 많은 것 간단 정리
<!doctype html> 이 웹페이지가 HTML로서 만들어졌다는 것을 표현(문서의 시작에 추가)
<html> : body 태그와 head 태그를 감싸는 태그
<head> : 본문을 설명하는 태그
<title> : 타이틀(웹페이지의 제목)
<meta> : / 닫지 않는 태그
UTF-8 인코딩으로 만들어진 웹 페이지라는 의미<meta charset=“utf-8“>
<body> : 페이지의 내용을 설명하는 태그
<div>
<a> :
<a href="https://youtu.be/ty-aa9Foj1Y"
target="_blank" title="Song">
버스커 버스커 – 첫사랑</a>
링크, href는 HyperTextReference의 약자.
title은 이 링크가 어떤 내용을 담고 있는지 툴팁으로 보여주는 기능
(마우스를 대고 있으면 나타나는 박스)
<script>
<link>
<img> : 이미지 / 닫지 않는 태그 , <img src=“coding.jpg“ width=“50%“>
<span>
<p> : paragraph, 단락 지정
<li> : list(목차), ul과 무조건 함께 사용
<ul> : unordered list, 목록을 구분할 때 사용, li 태그와 무조건 함께 사용
<ol> : ordered list, 목록에 번호를 매겨주며 목록을 구분, li 태그와 무조건 함께 사용
<style>
<br> : 단순 줄바꿈 / 닫지 않는 태그
<h2> : 글씨크기
<input> : / 닫지 않는 태그
<h1> : 글씨크기
<form> :
<h3> : 글씨크기
<nav>
<footer>
<header>
<iframe>
<button>
<strong> : 굵은 글씨
<i> : 이탤릭 글씨체
<u> : 밑줄
- 속성(Attribute) & img
<img src=“CuteDog.jpg” width=“50%”>
img 뒷 부분에 적은 src=“CuteDog.jpg” 나 width=“50%”를 속성이라고 함.
속성을 이용해서 내가 원하는 옵션을 추가하고 조절할 수 있음.
- 부모자식의 태그가 존재한다
<ul> </ul> unordered List <ol> </ol> ordered List
리스트를 경계짓기 위한 태그, ol을 쓰면 숫자까지 자동으로 매겨준다.
<li> </li>
리스트를 만들 때 사용하는 태그, 이 둘은 같이다닌다.
- 그 외
<meta charset="utf-8">
‘브라우저에서 utf-8로 이 문서를 읽어라’
<head> </head>는 본문을 설명하는 부분을 묶는다
<body> </body>는 본문을 묶는다
<html> </html>는 전체를 묶는다
<!doctype html>
관용적으로 씀. 이 문서는 html이다.
깃허브 웹호스팅 기능 사용해서 사이트를 만들어 보았음
https://reprisal123123.github.io/my-first-web-site/
'HTML & CSS' 카테고리의 다른 글
| 220418 CSS Chapter 9 (0) | 2022.04.18 |
|---|---|
| 220416 CSS Chapter 8 (0) | 2022.04.16 |
| 220415 CSS Chapter 6~7 (0) | 2022.04.16 |
| 220414 HTML Chapter 5 (0) | 2022.04.14 |
| 220413 HTML Chapter 3~4 (0) | 2022.04.13 |