본문 바로가기

프론트엔드/HTML5

HTML&CSS_BASIC - HTML개요(5) : HTML문서의 정보 HTML 문서의 정보 안에서 사용하는 태그들은 HTML 문서의 정보를 가지고 있습니다. TITLE(웹 페이지의 제목) HTML 문서의 제목을 정의합니다.웹 브라우저의 각 사이트 탭에서 이름으로 표시됩니다. META(웹 페이지의 정보) HTML 문서(웹페이지)에 관한 정보(표시 방식, 제작자(소유자), 내용, 키워드 등)를 검색엔진이나 브라우저에 제공합니다.빈(Empty) 태그입니다. 에서 사용할 수 있는 속성은 다음과 같습니다.각 태그는 자신이 사용할 수 있는 속성과 값이 정해져 있습니다.어떤 속성을 사용할 수 있고, 사용할 수 없는지 구분할 수 있어야 합니다.잘 사용하지 않는 속성도 있기 때문에 당장 모든 속성과 값을 암기할 필요는 없습니다.(‘전역(Global) 속성’이라고 해서 어느 태그에서나 사용.. 2020. 12. 31.
HTML&CSS_BASIC - HTML개요(4) : DOCTYPE(DTD) HTML 문서의 범위 index.html 같은 HTML 파일을 우리는 HTML 문서라고 표현할 수 있습니다.HTML 문서의 범위를 나타내는(의미하는) 태그들을 알아봅시다. 문서의 구조 HTML(전체 범위) 는 HTML 문서의 전체 범위를 지정합니다.웹 브라우저가 해석해야 할 HTML 문서가 어디에서 시작하며, 어디에서 끝나는지 알려주는 역할을 합니다. HEAD(정보 범위) 웹 브라우저가 해석해야 할 HTML 문서의 정보 범위를 지정합니다.여기서 말하는 정보에는 웹 페이지의 제목, 웹 페이지의 문자 인코딩 방식, 연결할 외부 파일의 위치, 웹 페이지를 구조화하기 위한 기본 세팅 값 같은 것들을 말합니다.다르게는 ‘화면을 구성하기 위한 기본 설정’이라고 표현할 수 있습니다. BODY(구조 범위) 웹 브라우저.. 2020. 12. 31.
HTML&CSS_BASIC - HTML개요(3) : 오픈소스와 라이센스 오픈소스 라이센스 오픈소스란 어떤 제품을 개발하는 과정에 필요한 소스 코드나 설계도를 누구나 접근해서 열람할 수 있도록 공개하는 것. 오픈소스라 하면 보통 무료 저작권이고 공짜로 사용해도 문제가 없다고 생각하지만 사실 다양한 종류의 오픈소스 라이선스가 존재하며 개인적 이용은 가능하지만, 상업적 이용에 제한이 있거나 경우에 따라 비용을 지불해야 할 수도 있습니다. 현실적으론 처음부터 끝까지 모든 코드를 직접 작성할 수 없기 때문에 많은 경우 오픈소스에 의존하게 됩니다. 개인적인 사용을 목적으로는 문제가 없겠지만, 회사에서(상업적으로) 아무 생각 없이 사용하다가는 문제가 돼서 해고당하거나 피해 보상을 해줘야 할지도 모릅니다. 물론 인터넷에 떠도는 코드 몇 줄 복사해서 썼다고 그 정도 심각한 문제가 되진 않겠.. 2020. 12. 31.
HTML&CSS_BASIC - HTML개요(2) : 확장, 웹에서 사용하는 이미지 확장 기능(Extensions) Beautify 코드 가독성을 위해 코드 작성 스타일을 (아름답게) 수정합니다. 입문자들에게 적극 추천합니다. Preferences > Keyboard Shortcut 선택 HookyQR.beautify를 검색(HookyQR.beautifyFile 아니에요!) 키 바인딩 선택 원하는 단축키 등록 Live Server 하단 상태 바(Status bar)에서 Go Live 선택 또는, HTML 화면에서 우클릭 > Open with Live Server 선택 Auto Rename Tag 태그 이름을 수정할 때 열린 태그와 닫힌 태그가 쌍으로 수정됩니다. 각각 수정해야 하는 번거로움을 줄일 수 있습니다. 그 외 추천 다음 확장 기능들이 당장 필요하지는 않을 겁니다. 나중에 살펴보.. 2020. 12. 31.