<head> 태그
- 메타 데이터를 포함하기 위한 태그
- 웹 페이지에 유일하게 존재
- HTML 문서의 title, style, link, script, meta에 대한 데이터로 화면에 표시되지 않음
<meta>
- 실제 브라우저에 내용을 보여주기 위한 것이 아닌 브라우저 정보를 담고 있음
<body> 태그
- HTML 문서의 내용을 담는 태그
- 웹 페이지를 구성하는 대부분의 요소가 body 태그 내에 기술
<h1~6>
- 제목을 뜻하는 Heading의 약자, h 사용
- 자동 줄 바꿈
- 하나의 HTML 문서에는 하나의 h1 태그를 권장
- 웹 검색 엔진이 제일 먼저 검색하는 태그
<p>
- 본문을 뜻하는 paragraph의 약자, p 사용
- 본문을 적기 위한 태그
<br>
- 줄 바꿈 태그
<ul>
- 순서 없는 목록 태그
ul type의 속성값
- disc : 채워진 동그라미
- square : 채워진 네모
- circle : 비워진 동그라미
- none : 아무것도 없음
<ol>
- 순서 있는 목록 태그
ol type의 속성값
- 1 : 숫자
- A : 대문자 알파벳
- a : 소문자 알파벳
- I : 대문자 로마 숫자
- i : 소문자 로마 숫자
<hr>
- 수평 선을 그어주는 태그
<summary>와 <detail> 태그
- summary를 클릭해서 숨긴 내용을 보이게 하거나 감출 수 있음
문자 꾸미기 태그
<b>은 두껍게, <strong>은 두껍고 semantic한 의미를 지님
<i>는 기울임, <em>은 기울이고 semantic한 의미를 지님
<img>
- 이미지를 넣어주는 태그
- src : 이미지 경로(필수)
- alt : 이미지 설명
상대경로 : 현재 위치로부터 경로를 찾는 것
절대경로 : 상단의 폴더부터 차례대로 경로를 찾는 것
<a>
- 기존 문서나 텍스트의 제약에서 벗어나 사용자가 원하는 정보를 취득할 수 있는 기능을 제공
- Anchor의 약자인 a를 사용
- href : Hypertext Reference의 약자, 이동할 페이지의 링크(필수)
- target : 링크 된 문서를 열었을 때 문서가 열릴 위치 표시
<form>
<input>
- form 태그 안에 input 태그를 넣을 수 있다.
type
- button : 버튼을 생성, 주로 특정 기능을 수행 시킬 때 사용
- text : 텍스트 입력 값을 받는 폼을 생성, 텍스트 값을 입력 받아 전달하는 기능
- password : 비밀번호 값을 받는 폼을 생성, 입력 값을 안보이게 처리
- checkbox : 여러 선택지 중 여러 개를 선택 가능한 체크박스 생성
- radio : 여러 선택지 중 하나만 선택 가능한 라디오 버튼 생성
- date : 특정 날짜(년/월/일)를 선택
<select>
- 선택 메뉴(드롭 다운)를 만드는 태그
<label>
- 접근성을 위해 label 태그를 필수로 사용
- input의 id와 label 속성 for의 속성값을 같게 하면 라벨만 클릭해도 해당되는 input이 선택된다.
크로스 브라우징
- 하나의 페이지가 많은 종류의 웹 브라우저에서 동작하도록 하는 것
'기록 > 새싹x코딩온' 카테고리의 다른 글
| [새싹x코딩온] 웹 퍼블리싱 과정 2주차 - 3 | CSS - flex, transform, transition (0) | 2023.06.24 |
|---|---|
| [새싹x코딩온] 웹 퍼블리싱 과정 2주차 - 2 | CSS - 위치 속성, 배경 속성 (0) | 2023.06.22 |
| [새싹x코딩온] 웹 퍼블리싱 과정 2주차 - 1 | CSS - 문자 속성, 박스 모델 속성 (0) | 2023.06.20 |
| [새싹x코딩온] 웹 퍼블리싱 과정 1주차 - 3 | CSS - table, 선언방식, 선택자 (1) | 2023.06.17 |
| [새싹x코딩온] 웹 퍼블리싱 과정 1주차 - 1 | Git (0) | 2023.06.14 |