2020/12/24 11
BODY 내 구조 개념 --> 콘텐츠 구분 예제

html에서 구조를 잡은 후에 css에서 html과 같은 구조로 틀을 만든후에, 사용하지 않는 css 태그를 하나씩 지우면 된다. 그것이 나중에 정리할 때 편하다. ctrl + shift + p 를 누르면 emmt abbreviation이 나오는데 거기에 원하는 태그이름을 넣으면 wrapping이 된다. 메뉴1 메뉴2 메뉴3 Section Article1 Contents... Article2 Contents... Article3 Contents... Aside asldkfjsladkf@gmail.com 010-1234-5678 header{ background : tomato; margin : 10px; padding : 20px; } header nav{ } header nav ul{ display :..
HTML/요소 2020.12.24

BODY 내 구조 개념 --> 콘텐츠 구분 SECTION

문서의 일반적인 영역을 설정 일반적으로 h1~h6를 포함하여 식별 How to Fish Introduction People have been catching fish for food since before recorded history… Equipment The first thing you’ll need is a fishing rod or pole that you find comfortable and is strong enough for the kind of fish you’re expecting to land… section은 문서의 구역을 설정하는것인데, 그 영역의 제목으로 h1~h6를 사용해서 구분한다. div section 영역구분 영역구분 의미 X 의미 O (제목을 포함)
HTML/요소 2020.12.24

BODY 내 구조 개념 --> 콘텐츠 구분 ARTICLE

독립적으로 구분되거나 재사용 가능한 영역을 설정(매거진/신문 기사, 블로그 등) 일반적으로 ~를 포함하여 식별 작성일자와 시간의 datetime 속성으로 작성 블록요소로 되어있다. Weather forecast for Seattle 03 March 2018 Rain. 04 March 2018 Periods of rain. 05 March 2018 Heavy rain. 다음과 같이 article태그 안에 article을 쓸수 있다. 자식요소 article은, 만약에 부모article에서 빠져나와서도 그것만의 독립적인 의미를 가지고 있게 된다면 자식 요소는 다른 태그가 아닌 article을 사용해야한다.
HTML/요소 2020.12.24

BODY 내 구조 개념 --> 콘텐츠 구분 H1~H6

6단계의 문서 제목을 구현한다. 구획 단계는 이 가장 높고 는 가장 낮다. 제목의 정보는 자동으로 문서의 목차를 만드는것 처럼 사용자 에이전트에 사용될 수 있다. 제목 폰트의 크기를 줄이기 위해 낮은 단계를 사용하지 마라. 대신에 CSS의 font-size 속성을 사용해라. 제목 단계를 건너뛰는 것을 피하라, 언제나 로 시작해서, 순차적으로 기입해라. 첫 번째 단계의 제목은 한 페이지에 하나만 적용해라. Heading elements Summary Some text here... Examples Example 1 Some text here... Example 2 Some text here... See also Some text here... h1은 딱 한번만 사용할 수 있지만, 다음과 같이 h2나 h3와..
카테고리 없음 2020.12.24
1 2
더보기

티스토리툴바