HTML&CSS
[HTML] HTML 기본
주씨.
2022. 1. 13. 19:47
728x90
# <head></head>
헤드는 사용자에게 보여지는 ui적인 요소가 전혀 없고, 구글에서 검색할 때 나오는 타이틀이나 부가설명 그리고 북마크 추가할 때 나오는 제목이나 아이콘들을 정의한다. css, js파일 연결도 이 곳에서 한다.
# Box형 태그와 Item형 태그
| Box형 태그 | Item형 태그 |
| header, footer, nav, asidde, main, section, article, div, span, form, ... | a, button, input, label, img, video, audio, map, canvas, table,... |
- article 은 반복되고 재사용이 가능한 것들을 묶는데 쓰인다.
- div는 보통 묶어서 스타일링을 하고 싶을 때 쓰인다.
# Block과 Inline
| Block | Inline |
| 한 줄에 오직 자신 하나 ex ) div |
공간이 허용하면 요소 바로 옆에 배치가 가능하다. ex ) span |
# label과 input
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>JS Bin</title>
</head>
<body>
<label for="name">Name : </label>
<input id="name" type="text">
</body>
</html><label>의 "for" attribute와, <input>의 "id" attribute에 주목하자.
이 label은 id="name"의 input을 위한 것이라고 지정하는 역할을 한다.
# 알면 간편한 단축키
ol>li*3 + tab
div.container>div.item.item${$}*10 + tab
