[2024 하계 모각코] "화성갈끄니까" [3회차] 계획 및 결과

3회차 목표 :  웹 프로그래밍 공부 : HTML

 

일정 : 7/11 :00~:00

 

3회차 공부 내용 :

 HTML은 웹 페이지라는 문서에 마크업을 하기 위한 언어 또는 구문이다. HTML은 1989~1990년에 학술 논문의 구조 설명을 돕고 초기 인터넷에 그 내용을 공유하기 위해 탄생한 언어이다. -논문의 특별 서식을 생각하자.

 

 특히 브라우저는 웹 페이지를 불러올 때,(HTTP 생각) HTML, CSS, Javascript가 포함된 반응을 어딘가의 서버로부터 받는다. 그저 텍스트에 불과하지만 이건 브라우저가 알아야 할 모든 페이지의 구조와 규칙이 들어있다. HTML이 규칙을 알기 때문에 이런 화면이 나온다. 논문에서 HTML이 탄생.

 HTML 요소로 꽤 많은 요소가 있다. 이미지, 양식 요소, 링크 요소, 머리말, 굵은 글씨, 이탤릭체 요소 등등.태그 구문으로 텍스트를 감싸서 원하는 양식으로 바꾼다. 여러 요소를 같이 사용하는데 태그로 문단을 만들고 마크업하여 표시한다.

HTML 파일의 확장자 표시가 중요한 이유는 두 가지로 저장할 때 VSCode에게 이게 HTML 파일임을 알려야 html 페이지로 생각해서 구문을 다른 색깔로 강조해 주기 때문이고, 브라우저가 파일을 열 때 파일을 HTML로 인식하여 HTML로 실행하게 하기 위해서 이다.

 

vs코드에서 새 파일은 커맨드 N이고, 새로고침은 커맨드 R이다. p택드는 텍스트 단락만을 위한 것이 아니라 단락처럼 묶고 싶은 어떤 내용이든 가능하다. 이미지 인풋 등등

 

단락이 생성되며 생기는 공간이 있는데 이 공간을 블록 레벨 요소라고 한다. 한 블록의 공간을 차지한다는 뜻이다.

제목 요소로 h1 태그는 한 페이지 당 하나만 있어야 한다. 최상위 제목으로 규정한다. h 태그는 정해진 글씨의 크기가 있고, 그것을 바꿀 수는 있지만 권장하지 않는다.h뒤 숫자는 모두 의미가 있는 것으로 h3가 있다면 h2가 있음을 뜻한다.크롬에 인스펙트는 커맨드 옵션 C로 들어갈 수 있다. 이게 개발자 도구이다.

태그로는 HTML 문서를 충족하지 못 한다. HTML의 골자를 배워야 한다. 상용구-boiler

 

!DOCTYPE html 은 html5를 사용하고 있다는 뜻으로 제일 최신의 HTML을 사용하는 것이다. html 태그는 문서의 최상위 요소로 루트 태그이다. 모든 것을 담는 것이다. 아무 거나 넣는 것이 아니다. 하나의 헤드와 하나의 바디 한 쌍. 헤드는 메타데이터 요소이다. 웹 페이지와 스크립트에 관한 모든 메타 데이터 정보로 CSS에서 스타일 속성을 입력할 공간이 바로 여기이다. 타이틀 요소는 브라우저 탭 상에 표시되는 정보이다. 구글은 타이틀 요소로 검색을 한다. 느낌표 탭을 누르면 자동으로 HTML 양식이 만들어진다.

커맨드 쉬프트 p 하면 팔레트가 열린다. 포맷 다큐먼트  쉬프트 옵션 F  자동으로 포맷을 정렬해줘서 가독성이 더 좋아진다.