My Study/서적 공부
[코딩 자율학습 HTML + CSS + 자바스크립트] 1. HTML로 웹 구조 설계하기 - "2장 HTML 문서 작성을 위한 기본 내용 살펴보기"
handbefore
2024. 7. 20. 18:10
2.1 HTML의 기본 구성요소
1. 태그
- HTML 문법을 이루는 가장 작은 단위
- 웹페이지 구성요소 정의.
<태그명>
2. 속성
- 태그를 의미나 기능적으로 보충.
<태그명 속성명="속성값">
3. 문법
- HTML 문법은 태그와 속성으로 구성
- 속성은 생략가능
- 속성은 여러개 사용 가능
- 태그없이 단독 사용 불가능.
- 콘텐츠가 있는 문법 (시작태그+종료태그)
<title>My First Web Page!</title>
- 콘텐츠가 없는 문법 (시작태그)
<br>
4. 주석
- 코드에 메모나 설명을 남기고 싶을 때 사용.
- 웹 브라우저의 소스 보기로 주석이 노출되므로 보안이 필요한 내용 작성 x
<!-- 주석 -->
2.3 HTML의 기본 구조
5.HTML의 기본 구조
<!DOCTYPE html> *DTD: 문서형 정의. 문서 작성할 때 항상 처음에 넣어야 함*
<html lang="ko"> *문서의 시작과 끝*
<head> *메타 데이터 정의 영역. 문서에 대한 정보*
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>문서의 제목/title> *문서의 제목 (중복되지 않도록 주의)*
</head>
<body> *웹 브라우저에 노출되는 내용을 작성하는 영역*
</body>
</html>
2.3. HTML의 특징 파악하기
6. 블록 요소와 인라인 요소
- 블록요소: 공간과 상관없이 항상 줄 바꿈 되는 태그로 작성한 코드
- 인라인 요소: 공간이 부족할 때만 줄 바꿈 되는 태그로 작성한 코드
7. 부모, 자식, 형제 관계
- 태그 사용위치에 따라 부모, 자식, 형제 관계 성립
8. 줄 바꿈과 들여 쓰기
- 코드의 가독성 높임 (암묵적 규칙)
출처
코딩 자율학습 HTML + CSS + 자바스크립트
기초부터 반응형 웹까지 초보자를 위한 웹 개발 입문서
www.gilbut.co.kr