HTML(39)
-
[HTML] 문자 콘텐츠(1) - ol, ul, li, dl, dt, dd
▶ , , 각 항목()의 정렬된 목록()이나 정렬되지 않은 목록()을 설정. 목록을 구성하는 태그로 + 또는 + 가 한 세트를 이룸. - : Ordered List. 순서가 있어야 하는 목록. - : Unordered List. 순서가 필요하지 않은 목록. - : List Item. 목록 안에 있는 각각의 항목. 과 은 자식으로 만 포함 가능. 반드시 를 포함해 세트로 사용해야 함. 는 단독으로 사용될 수 없음. 이나 에 자식 요소로 포함되어 있어야 함. 정렬된 목록()의 항목 순서는 중요도를 의미할 수 있어 중요도 표시에 활용 가능. 과 은 Block level 요소. 의 경우 display: list-item;. Block level 요소에 소속된 개념. - , 이 block 요소기 때문에 그 안에 ..
2020.08.22 -
[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