[복습]
*html 역할
- 공간만 제공. 눈에 보이지 않는 구조. 뼈대
- 사이트 간에 이동 (로그인)
*css
- 벽
*java
- 사용자랑 상호작용
*태그
- 브라우저가 알아들을 수 있도록 해줌
??? css 제일 마지막 명령만 처리 ???
[html, css가 존재하는 이유]
- 명령 프롬프트로 인터넷을 사용했을 때와 다르게 만들어진 디자인을 브라우저에 띄워줘야 하기 때문에 HTML, CSS가 존재한다고 생각하면 편하다.
[화면 크기만큼 크기를 가지는 태그가 필요한 이유]
- 아무리 고정형 사이트라 해도 양 옆 여백은 유연하게 줄어야 하기 때문이다.
- 반응형 사이트에서는 사용자 화면 해상도부터 시작해야 되기 때문에 존재한다.
예시) 수업에 띄워준 니콘 사이트 배너영상처럼 화면너비와 높이대로 반응하는 영상이 디자인에 필요하다. 그 디자인을 배너에 만들어주려면 화면 너비와 높이만큼 크기를 가지고 있는 태그가 필요하다.
니콘 사이트: hrrps://www.nikc.nickon.com/
[HTML 구조]
- HTML에서 구조는 크게 두가지로 나뉜다.
- head태그와 body태그.
- head태그는 html에서 정보를 담당한다.
예를 들어 어떤 css파일과 연결했는지 어떤 라이브러리 링크와 연결되었는지 등등...
- body태그는 html에서 본격적인 구조를 담당한다. 뼈대와 아이콘 이미지 등...
[DOCTYPE]
- DOCTYPE은 HTML이 브라우저에 읽혀 들어갈 때 버전이 올바른 형태인지 확인하는 용도로 생각하면 쉽다.
[코드펜과 DOCTYPE, HTML, CSS]
- 코드펜은 초보자가 쉽게 사용하거나 강의를 쉽게 할 수 있도록 개발된 에디터이기 때문에 DOCTYPE 선언이 되어있는 상태로 개발되었다.
때문에 코드펜에 구조를 구현할 때는 DOCTYPE 선언을 하지 않아도 되지만 실제 개발 프로그램 사용시 반드시 DOCTYPE 선언 후 구현 해야된다.
* DOCTYPE 선언 방법은 vscode 사용방법 학습시간에 언급 예정
[학습]
- 어떤 내용이든 목적과 근본을 먼저 공부하면 이해하기 쉽다.
예시) HTML, CSS는 디자인 툴로 완성된 디자인을 브라우저에 띄워주기 위해 만들어졌다.
예시) 포토샵은 비트맵 이미지를 합성 편짐하기 위해 만들어졌다.
ㄴ영역선택툴은 큰 이미지에서 특정한 영역만 선택하여 편집하기 위해 존재한다.
*** 교재 p.304~310
html은 기본적으로 투명한 색상을 가지고 있으며 ~~