👉마크업
| 구조 | 표현 | 액션(동작) |
|---|---|---|
| 뼈대 | 치장 | 행동 |
| HTML | CSS | Front, back, java... |
📌DOCTYPE(DTD, 버전 지정)
-마크업 언어에서 문서 형식을 정의
ex. html문서를 어떤 버전의 html로 해석하느냐, 구조화하느냐
(HTML은 크게 1, 2, 3, 4, X-, 5 버전이 있다.)📌html- 전체 범위
📌head -정보 범위(문서의 정보)
<!DOCTYPE html>
<html lang="en">
<head>
<!--meta->웹 페이지의 정보-->
<meta charset="UTF-8"> <!--문자인코딩 방식. 값:UTF-8, EUC-KR -->
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!--name->검색엔진 등에 제공하기 위한 정보의 종류(메타 데이터)
(값. author, description, viewport등..)-->
<!--content->name이나 http-equiv 속성의 값을 제공-->
<title>Document</title> <!--웹 페이지의 제목-->
<link rel="stylesheet" href="./css/main.css">
<!--외부 문서를 연결할 때 사용 rel->현재 문서와 외부문서 관계 지정,
//값: stylesheet, icon//
href-> 외부 문서의 위치를 지정-->
<script src="./js/main.js"></script>
</head>
<body>
</body>
</html>📌body -구조 범위(문서의 구조)
📣POINT
1. 요소 중첩, 마무리를 잘하자
2. 요소 및 속성이름 ->소문자
속성 = "속성값"(세트)
EX. IMG 태그의 필수 속성은 src, alt
3. 홀태그(빈요소) / 쌍태크
📌용어 정리
| 파이프라인 : 클론
{} 브레이스 ; 세미클론
[] 브라켓 '' 싱글 쿼테이션
() 스몰라운드 "" 더블 쿼테이션
|| 또는
[] 안에 있는 것은 생략가능 표시📌자주쓰는 특수 기호
참고 출처: http://kor.pe.kr/util/4/charmap2.htm
📌웹 표준 검사하기
https://validator.w3.org/#validate_by_upload
-html 문서를 업로드하고 테스트 시작
🍀걸어가는 중