html 태그
head 태그
title 태그
페이지를 열었을 때, 제목(title)을 결정
base 태그
src, href 등의 경로를 선택하기 전, 기본 경로를 변경할 수 있는 태그
meta 태그
[속성 - charset - 언어 설정]
charset="UTF-8"
charset="UTF-8"
[속성 - http-equiv, content - 인터넷 브라우저 설정]
http-equiv="X-UA-Compatible" content="IE=edge"
http-equiv="X-UA-Compatible" content="IE=edge"
[속성 - charset - 언어 설정]
charset="UTF-8"
charset="UTF-8"
[속성 - name, content - 지정 name - 디바이스 가로길이에 따른 크기조절]
name="viewport" content="width=device-width, initial-scale=1.0"
name="viewport" content="width=device-width, initial-scale=1.0"
[속성 - name, content - 미지정 name - 메모]
name="author" content="제작자명"
name="author" content="제작자명"
link 태그
[속성 - rel, href, (+size), (+media) ]
아이콘 설정
rel="apple-touch-icon" href="파일경로" size="72*72"
rel="shortcut icon" href="파일경로"
stylesheet 설정
rel="stylesheet" href="파일경로"
rel="stylesheet" href="파일경로" media="screen and (min-width:992px)"
rel="stylesheet" href="파일경로" media="screen and (max-width:991px)"
body 태그
배치방식 태그
table
기본테이블 item1 item2 item3 item4 item5 item6 item7 item8 item9
colgroup활용 20030001 김학생 1학년 20020001 이학생 2학년 20010001 정학생 3학년
th활용 학번 이름 학과 20001234 홍길동 전자공학과
thead/tbody/tfoot 활용 열 1 열 2 열 3 1-1 1-2 rowspan 2-1 2-2 colspan DL
- DL-DT
- DL-DD
ul-li
- ul-li-순서1
- ul-li-순서2
- ul-li-순서3
- disc
- circle
- square
- decimal
- georgian
- trad-chinese-informal
- kannada
- 1
- 2
- 3
- marker1
- marker2
- marker3
ol-li
- ol-li-순서1
- ol-li-순서2
- ol-li-순서3
- ol-li-순서1
- ol-li-순서2
- ol-li-순서3
blockquote
들여쓰기
기능태그
a태그
- 필수속성 : href= "tel:전화번호" / "mailto:이메일주소" / "(상대/절대)경로" / "인터넷주소"- 선택속성 : download="다운로드시 명칭", target = "_blank" / "_parent" / "_self" / "_top" / "iframe name과 동일", rel[target선행필수] = "nofollow" / "noopener noreferrer" / "alternate", hrelang[링크된 문서의 언어를 지정] = "kr"abbr태그
- 필수속성 : title쭈팡뼈template태그 - JS처리 필수
img, map-area
- 속성 : alt, coords, download, href, media, rel, target
figure태그
figure-figcaption - 콘텐츠에 대한 설명을 제공 canvas태그
svg태그
select-option태그
code태그
System.out.println(var);data태그
Value:100button태그
input type
- button
- checkbox
- color
- date
- datetime-local
- file
- hidden
- image
- month
- number
- password
- radio
- range
- reset
- search
- submit
- tel
- text
- time
- url
- week
textarea태그
form - fieldset태그 - 데이터 전송시
form - input/output태그 - 자체 계산
meter태그
60% progress태그
dialog태그
object태그 - 아래의 다른거(embed, iframe, audio, video, picture 등) 사용할 것
- data : jpg, html, mp4, wav 등embed태그
- 외부 컨텐츠 불러오기(외부사이트X)- type : image/jpg, application/pdf 등 다양함iframe태그
audio태그
- audio포멧 : mp3(mpeg), wav, ogg- 속성 : autoplay, controls, loop, muted, preload, srcvideo태그
picture태그
글자기능 태그
굵게 b Strong 기울이기 i em 밑줄 u ins 중앙줄 sdel크게 big 작게 small 윗첨자 sup 아래첨자 sub 글자반대로bdo 요미가나 ruby夏 특수문자(이모티콘) 💬 http://www.unicode.org/emoji/charts/full-emoji-list.html 특수기능없이 문자스타일만 변경 cite dfn kbd mark qsamp span
box배치방식 태그
H1
H2
H3
H4
H5
H6
p - 다른 display:block인 태그 포함 불가
pre - 내용의 공백과 줄 바꿈을 그대로 유지Non-Semantic Tagdiv
Semantic Tag[의미적 태그] addressarticle section header