html(38)
-
[HTML] Contents 구분(3) - nav, address, div
▶ navigation의 약어, 다른 페이지에 대한 링크를 제공하는 영역. 내의 메뉴, home, about, contact us, 목차, 색인 등을 설정. - 반드시 header 내에 있어야 하는 것은 아님. 특정한 페이지에서 외부로 나가는 링크를 그룹화 하여 연결할 때 를 통해 묶어 줄 수 있음. - 예) 메뉴는 해당 페이지로 이동하는 역할을 함. 이때 전체 묶음을 를 통해 만들어낼 수 있음. - 메뉴를 묶을 경우 보통 사용. 안에는 , 이 삽입되어 사용되는 경우가 많음. - 목록 세트를 로 묶어 사용. - 이 부분이 navigation 역할을 하는 영역이라고 설정하는 것. Block level 요소 ※ , , , , , , 등 영역을 설정하는 태그들은 모두 Block level 요소에 해당함. ▶ ..
2020.08.21 -
[HTML] Contents 구분(2) - main, article, section, aside
▶ 문서 내부의 핵심적인 Contents를 지칭할 때 사용. - 내의 주요 Contents를 나타냄. 주요 Contents 구역은 문서의 핵심 주제나 애플리케이션의 핵심 기능성에 대한 부연, 또는 직접적으로 연관된 Contents로 이루어짐. - 예로 블로그에서 사이드, 광고, footer 등의 부분을 제외하고 핵심 포스트 부분이 main에 해당. 은 hidden 속성이 사용된 것을 제외하고 문서당 하나만 존재해야 함. Internet Explorer에서 지원하지 않음. Block level 요소. ▶ 독립적으로 구분되거나 재사용 가능한 영역을 설정. , , 태그는 문서의 헤더, 푸터, 메인(핵심)을 지정해 범위를 설정은 매거진, 뉴스 기사, 블로그 등에 사용됨. 일반적으로 ~를 포함하여 식별. 작성일자..
2020.08.21 -
[HTML] Contents 구분(1) - header, footer, h1 ~ h6
▶ 소개나 탐색을 돕는 그룹 일반적으로 사이트 가장 상단 부분에 bar가 있으면 header라고 지칭. 로고, 메뉴, 검색 바, 로그인/로그아웃, 회원가입 버튼 등으로 구성. 내에는 다른 나 가 자손으로 올 수 없음. 또한 , , 다른 의 자손이 될 수도 없음. 브라우저 호환성은 Full Support. Block level 요소. ▶ 사이트 하단에 회사 정보, 구획의 작성자, 저작권 정보, 관련 문서 등의 내용을 담음. 내에는 , 가 자식 요소로 올 수 없음. 브라우저 호환성은 Full Support. Block level 요소 ※ , 와 , 는 로 대체해 사용할 수 있음. 하지만 , 는 각각 header와 footer라는 영역을 지칭하겠다는 의미를 가짐. 의미를 가진다는 것은 브라우저, 검색 엔진, ..
2020.08.21 -
[HTML] Block 요소와 Inline 요소
▶ Block 요소 - , , 등 1. 사용 가능한 최대 가로 너비를 사용함. - 가로 너비를 지정하지 않았으나 화면의 왼쪽부터 오른쪽 끝까지 배경색이 모두 출력됨. 2. 크기를 지정할 수 있음. - 지정된 px만큼의 너비와 높이를 가지는 영역이 됨. 3. width: 100%, height: 0px에서 출발 - 이 값에서 출발해서 요소가 완성되는 것. - block 요소가 늘 이 값을 가진다는 건 아니라는 점에 유의. - 이전 예와 비교해 height를 지정하지 않으면 내용의 높이만큼만 영역을 가지게 됨. 4. 수직으로 쌓임. - 블록요소는 왼쪽 상단을 기준으로 위에서 아래로 수직으로 쌓임. 5. margin, padding 속성의 상하좌우 여백을 온전하게 사용 가능. - block 요소는 상하좌우 여..
2020.08.20 -
[HTML] 메타데이터(2) - <meta>
▶ 는 HTML 문서(웹 페이지)에 관한 정보(표시 방식, 제작자, 문자 인코딩 방식 등)를 검색 엔진이나 브라우저에 제공함. , , , 에서 나타낼 수 없는 기타 모든 정보들을 표시. 속성 - charset 문자 인코딩 방식(텍스트가 출력되는 방식)을 설정. HTML 문서 내에 작성된 모든 문자들이 화면에 어떻게 출력될지 정의함. UTF-8, EUC-KR 등. 이전에는 EUC-KR이 많이 사용되던 추세였으나 최근에는 UTF-8을 선호함. 문자 인코딩 방식을 설정하는 것이기 때문에 charset 속성을 나타내는 는 보통 보다 앞에 작성함. - content http-equiv 또는 name 속성의 값을 작성. - http-equiv 서버/사용자의 작동방식을 변경할 수 있는 지시사항을 명시(지시사항은 co..
2020.08.20 -
[HTML] 메타데이터(1) - title, link, style, MIME Type, base
내에서 사용하는 태그들은 HTML 문서의 정보를 담고 있음. ▶ HTML 문서, 즉 웹 페이지의 제목을 정의함. 웹 브라우저의 각 사이트 탭에 이름/제목으로 표시됨. HTML 문서의 구조화보다는 정보를 나타내는 태그로 페이지 정보가 브라우저 탭 영역에 출력되기는 하나, 출력을 목적으로 작성하는 것은 아님. ▶ 현재 HTML 문서 외부에 있는 문서를 연결하기 위해 사용. - 특히 HTML 문서 외부에서 작성된 stylesheet(css 문서, .css)를 읽어와 연결시킬 때 가장 많이 사용됨. - 파비콘(favicon) 연결 시에도 사용. 속성 - rel : relationship의 약어. 현재 문서와 외부 문서와의 관계를 명시. 필수 속성. rel은 임의로 작성하는 것이 아니라 정해진 규약 내에서 작성해..
2020.08.20