* <body> 영역의 요소 | |
: 문단 관련 요소 | |
<h1> ~ <h6> | - 대제목, 중제목, 소제목....정보계층을 기계적으로 구조화하는 역할. 순차적으로 계층 구조를 지키는 것이 바람직. - 다른 블록요소를 포함할 수 없으며, 인라인 요소와 텍스트만 포함. - 디자인상 생략된 헤딩 요소를 특성에 맞게 마크업할 때 정보접근성이 좋아 CSS를 이용해 숨길 수 있다. - 레이아웃을 위한 헤딩 사용은 지양. |
<p> | - 텍스트를 단락으로 정의할 때 - 문단 작성 - <a> <img> 등 인라인 요소와 텍스트만 포함 가능, 다른 블록요소 포함不可 |
<br> | - 단락에서 강제 줄바꿈시 사용 , 'line break'의 의미 - 빈 엘리먼트 : <br /> - 키보드 Enter만 사용하면 공백(space)만 추가될 뿐, 줄바꿈 효과없음. - br 요소 남발 금물. : 정렬하기 위해 강제로 br 요소를 사용해 문장나누기 X <span> 요소를 사용하면 br 요소 사용과 같은 효과를 줄 수 있음. ex. <p> 웹 접근성 향상을 위한 <span style="padding-left:20px;"> </span>국가표준 기술 가이드 라인</p> |
<address> | - 문서 아래쪽 연락처 및 제작자 저작권 정보 표시 - 다른 블록요소 포함 不可, 인라인 요소와 텍스트만 포함 가능. 기울임형태로 렌더링. tip. address 요소안에 p요소 사용가능? - transitional : 인라인 요소, p요소 가능 - strict : 인라인만 가능 worst case: 일반 주소 콘텐츠에 사용한 경우 |
<hr> | - 수평선으로 표현되어 구분선 역할. - 빈 엘리먼트 : <hr /> - 논리적 의미의 구문 X, 콘텐츠 전후의 내용 구분. |
<blockquote> | - 인용된 문단 표시, 인용 출처를 표시하기 위한 전용 속성 cite를 갖는다. - 블록단위의 인용문, 블록요소만 포함 : 좌우여백으로 일반 단락과 구별되어 출력 - strict dtd 일 경우, <blockquote>에 텍스트요소나 인라인 요소를 직접 포함 불가, 다른 블록레벨 요소를 포함하여 작성해야 함. |
<blockquote cite="출처" title="coforward가 생각하는 웹이란“><p><em class= "coforward">co<span>Forward</span></em>는 웹사이트가 운영자와~</p> </blockquote> | |
<q> | - 인용된 짧은 문장. 인라인 요소와 텍스트 포함. - <blockquote>와 동일한 용도의 인라인 레벨 요소. cite 속성 ○. |
<p> 텍스트<q cite="출처“> 인라인 인용구</q>텍스트</p> | |
<pre> | : 정형화된 텍스트 |
- 공란과 줄 바꿈 등이 병합되지 않고, 소스에서 입력된 그대로 표시. - 프로그램의 코드를 표시하는 용도로 자주 사용. - 블록 레벨 요소이나, 블록요쇼, Form관련 요소, script 관련 요소를 콘텐츠 요소로 포함 불가. |