기본
<h1> ~ <h6> : 제목
<p> : 단락
<hr> : 수평줄 삽입
<br> : 줄 바꾸기
- <br> 태그는 다른 글자 태그 내부에 삽입이 가능하나 <hr> 태그는 불가능하다.
택스트효과
<b> : 진하게
<strong> : 중요한 강조
<em> : 강조
<i> : 기울기로 강조
<small> : 한 단계 작은 문자
<del> : 삭제(가로 줄)
<ins> : 추가(밑줄)
<sup> : 윗첨자
<sub> : 아래첨자
<mark> : 하이라이팅
블록과 링크 태그
<pre> : HTML 코드에서 작성한 텍스트 서식을 그대로 표현
<div> : 블록 형식으로 공간 분할 -
- 블록 전체에 동일한 CSS 스타일 적용 또는 자바스트립트로 블록을 하나의 단위처럼 다루고자 할 때 사용
<span> : 인라인 형식으로 공간 분할
- 텍스트 일부분에 특별한 모양 적용 또는 자바스크립트 코드로 텍스트 일부분을 제어할 때 사용
<a> : 하이퍼링크 - 현재 HTML 페이지에서 다른 HTML 연결하는 링크를 만들고자 할 때 사용
- target="_blank" - 해당 링크가 새로운 탭에서 열리게 된다.
- title="" -해당 링크에 마우스를 올려놓았을때 설명이 나온다.
<iframe> : 인라인 프레임 - 현재 HTML 페이지 내에 내장 윈도우를 만들고 다른 HTML 페이지를 출력할 때 사용
- src : 출력할 웹 페이지의 URL 주소
- srcdoc : HTML 문서 텍스트
- name : 윈도우 이름 | 다른 웹 페이지에서 target 속성 값으로 사용
- width : 프레임의 폭
- height : 프레임의 높이
메타 태그
- <base> : URL과 웹 페이지가 출력될 윈도우를 지정하기 위해 사용
- <link> : CSS 파일을 불러오는 태그 - <head>에서만 사용 된다.
- <script> : 자바스크립트 코드를 담는 태그
- <style> : CSS 스타일 시트를 담는 태그
- <meta> : 웹 페이지의 저작자, 문자 인코딩 방식, 문서 내용 등 다양한 메타 데이터를 표현하기 위해 사용 - name과 content의 속성 쌍으로 구성
이미지
- <img> : 이미지 삽입 | BMP, GIF, PNG, JPG(JPGE), animated-GIF
- src : 이미지 파일의 URL
- alt : 이미지를 출력할 수 없는 경우 출력되는 문자열
- title:마우스를 올려 놓았을때의 설명
리스트
- <ol> : 순서 있는 리스트
- <ul> : 순서 없는 리스트
- <ul type="disc"> : 기본형 •
- <ul type="circle"> : 동그라미 ◦
- <ul type="square"> : 네모 ▪︎
- <li> : 리스트의 아이템
- <dl> : 정의 리스트
- <dt> : 용어
- <dd> : 설명
테이블
- <table> : 표 전체를 담는 컨테이너
- <caption> : 표 제목
- <thead> : 헤드 셀 그룹
- <tbody> : 데이터 셀 그룹
- <tfoot> : 바닥 셀 그룹
- <tr> : 행 - 여러 개의 <td>, <th> 포함
- <th> : 제목(헤드) 셀
- <td> : 데이터 셀
- <th> & <td> 속성
- colspan 속성: 셀의 너비 지정 - 열 합침
- rowspan 속성: 셀의 높이 지정 - 행 합침
미디어
- <audio> : 오디오
- src : 오디오 파일의 URL
- controls : 재생, 재생 시간, 중단, 음소거 등 제어 버튼 출력
- autoplay : 오디오 로딩 즉시 재생
- loop : 반복 재생
- <video> : 비디오
- src : 비디오 파일의 URL
- width : 비디오 재생 영역의 폭
- hight : 비디오 재생 영역의 높이
- controls : 재생, 재생 시간, 중단, 음소거 등 제어 버튼 출력
- autoplay : 비디오 로딩 즉시 재생
- loop : 반복 재생
- muted : 오디오 off
- <embed> : 플러그인의 설치를 통한 미디어 재생 - 표준화되지 않은 미디어를 재생할 때 사용
입력
- <from>:사용자로 부터 입력을 받아줄수 있는 태그
- method="post" enctype="multipart/form-data"
- <textare>:여러줄의 text양식
- cols="n":가로크기
- rows="n":세로크기
- <label>:폼태그 안에서 인풋데이터의 제목을 쓰는 태그
- for="태그의id":input태그와 label태그를 연결시켜줌
- <input>:입력창
- type="number":증감하는 숫자만 입력
- type="color":색깔선택
- type="date":날짜선택
- type="url":인터넷 주소만 가능
- type="file":파일전송
- autocomplete="on or off":자동완성
- autofocus:포커싱 이동
- pattern:정규 표현식 지정
- require:데이터 전송할때 데이터안보내고 메세지 띄워주기
