HTML & CSS3 HTML의 메타데이터 최근 예전에 만들었던 프로젝트 코드를 정리하면서 큰 고민 없이 써왔던 html 코드가 신경 쓰이기 시작했다. 그래서 이번 기회에 한 번쯤 정리해두고 싶었던 메타데이터에 대해 정리해 보기로 했다. 참고로 메타데이터란 일련의 데이터를 정의하고 설명해 주는 데이터를 의미한다. 먼저, HTML 문서의 구조를 보면, This is my page 로 이 문서가 HTML 문서임을 나타내고, 태그 안에 요소와 요소가 위치해 있는 것을 확인할 수 있다. 요소는 실제 화면에 보이는 부분은 아니지만, 검색 결과에 노출될 키워드, 홈페이지에 대한 설명 등을 담고 있으며, 요소는 실제로 페이지에 표시될 콘텐츠가 포함되는 부분이다. 위 예제의 안에 있는 은 문서의 문자 인코딩 설정을 UFT-8 (전 세계에서 사용되는 대부분의 문.. 2023. 8. 22. 노마드 코더 코코아톡 클론코딩 복습용 정리(2) #3 CSS를 배워보자. CSS를 HTML에 추가하는 방법은 1) 같은 파일에 두는 방식과 2) 다른 파일로 분리하는 방식이 있다. 분리하는 방식을 추천하는데, 그 이유는 만들어진 CSS 파일을 link하면 다른 HTML페이지에서도 사용할 수 있기 때문이다. 물론 보기도 좋다. 1) head 안에 style 태그 작성. 2) CSS 파일을 생성하여 link 하기. ☞ CSS 코드 작성하는 법 : selector(가리키는 대상)를 쓰고, 중괄호{ }를 사용하여 속성을 작성. ※ 브라우저는 CSS를 위에서부터 읽는다. (CSS의 cascading한 성질) 즉, 맨 마지막에 작성된 코드가 최종적으로 보이게 됨. ▶ box 1) block : box, p 등은 그 옆에 아무것도 오지 않는다. 한 줄에 하나만! .. 2022. 12. 13. 노마드 코더 코코아톡 클론코딩 복습용 정리(1) ~ 간단한 이론 ~ 웹사이트를 만드는 데 필요한 도구는 HTML, CSS 그리고 JavaScript. HTML이 뼈대라면 CSS는 뼈대에 붙는 근육, 즉 디자인이고 JavaScript는 동적인 부분을 담당하는 뇌라고 할 수 있다. (참고로 이중 자바스크립트만 프로그래밍 언어임.) #2 HTML을 배워보자. ! 주의할 점 ! 파일 경로 같게 하기. 폴더명과 파일명은 소문자로. 파일명 뒤에 .html(확장자)을 쓰면 html파일을 만들 수 있음. 비주얼 스튜디오 코드의 동그라미 표시는 저장을 안 했다는 뜻. 저장을 습관화하자 ctrl+s 참고로 VSCode는 다양한 확장 프로그램을 사용할 수 있다. 태그(tag) ● h1~6 : header number1~6 ● list (종류는 두가지 ① ordered l.. 2022. 11. 14. 이전 1 다음
