1. 플랫폼이란?
특정 기술들의 모음집 또는 환경
2. WEB (World Wide Web)
거미줄처럼 연결된 세계
3. 프론트엔드란?
정보를 어떻게 화면에 보여줄 것인가에 대한 기술
4. 웹 페이지의 3대 구성 언어
-
HTML (Hyper Text Markup Language): 구조
-
CSS (Cascading Style Sheet): 디자인
-
JavaScript: 동작/기능
5. HTML의 정의
-
웹 페이지와 그 내용을 구조화하기 위한 마크업 언어
-
웹 문서를 구성하는데 사용됨
6. HTML의 기본 문법 : 태그
html
복사
편집
<태그이름 속성="속성값"> 콘텐츠 </태그이름>
태그는 요소의 시작과 끝을 나타냄
여는 태그와 닫는 태그는 이름이 같고 /로 닫는 태그를 구분
7~10. 태그의 구성 요소
- 태그 이름: 어떤 콘텐츠인지 의미
- 콘텐츠: 실제로 표시할 내용
- 속성: 부가 기능 추가
- 속성값: 기능이나 설정 구체화
11. HTML 문서의 기본 구조 예시
html
복사
편집
<!DOCTYPE html>
<html>
<head>
<title>문서 제목</title>
</head>
<body>
<h1>웹 페이지 제목</h1>
<p>본문 내용</p>
</body>
</html>12. HTML 요소의 개념과 역할
웹 페이지를 구성하는 개별 단위
태그를 이용해 표현하며 브라우저가 내용을 해석하는 기준이 됨**
12-1. 제목 태그 (h1~h6)
가장 큰 제목
/ H1가장 작은 제목
/ H612-2. 문단 태그 (p)
문단 내용을 여기에 작성
/P12-3. 목록 태그 (ul, li)
12-4. 순서 있는 목록 태그 (ol, li)
13. 컨테이너 요소
요소들을 묶고 구조화하거나 스타일 적용
요소 특징
블록 수준, 줄 바꿈 발생
인라인 수준, 줄 바꿈 없음
14. 전역 속성 (모든 요소에 공통 사용 가능)
class: 여러 요소에 동일 스타일 적용
id: 고유 식별자 (1개 요소에만 사용)
15. Bootstrap
-
프론트엔드 개발을 도와주는 CSS 프레임워크
-
미리 정의된 스타일과 컴포넌트를 제공
열심히하는QA가되고싶어요