log 2015. 6. 5. 13:10
텍스트 요소
- a : 링크
- em : 강조
- strong : 중요성
- small : 세목
- cite : 출저
- q : 인용문
- dfn : 정의어
- abbr : 약어
- time : 날짜와 시간
- code : 프로그램 언어
- sub : 아랫첨자
- sup : 윗첨자
- i : 이텔릭체
- b : 굵은 글씨
- ins : 밑줄
- del : 수정 텍스트 가운데 줄
- mark : 하이라이트
- ruby : 루비 문자 선언
- rt : 루비 문자 텍스트
- rp : 루비 미지원 브라우저 출력 태그
- s : 관련이 없어짐 표현
- u : 고유명사 철자 표현
em
디자인 목적으로 강조, CSS 처리
html4-강조, html5-중요성(strong)을 표현하지 않음
<p>나는<em>아침에</em>출근한다.</p>
<p>나는<em>저녁에</em>퇴근한다.</p>strong
중요성 전달에 대한 범위 표현
html5-중요성과 강조를 구분하여 표현
strong 강조 시멘틱 의미 제거, 중요성 시멘틱 부여
<p><strong>주의:최근에 바이러스가 퍼져 환자가 급증하고 있습니다.</strong>반드시 마스크를 착용하세요</p>small
작은 텍스트로 표현되는 주석
면책조항의 경고, 법령제약, 저작권 표시의 법률용어, 제약의 조건, 라이센스 요건
<footer>
<p><small>copyright© 2015.</small></p>
</footer>
<article>
<hgroup>
<h1>개발자센터</h1>
<h2>개발자 웹퍼블리셔</h2>
</hgroup>
<p>개발자센터<small>(서울 강남구 강남대로)</small>에서는 CDN 서비스를 제공하고 있습니다.</p>
</article>
<p>
<strong><small>CDN 서버 불안정에 의한 홈페이지 연결 오류에 대하여 어떤 책임도 지지 않습니다.</small></strong>
</p>cite
인용 내용의 제목 또는 출저
사람의 이름에는 사용하지 않음
<p>IT 서적<cite>반응형 웹을 위한 자바스크립트</cite></p>q
인용 문
문단(구) 에서만 사용
여러 장을 표현하는 블록단위 사용 불가
블록 단위 사용시 - blockquote 사용
<p>프로이드는<q>구순기고착은 불신, 사랑 거부, 친근한 관계형성 하는데 대한 공포와 무능</q>이 라고 하였다.</p>dfn
정의어
기술목록, 용어에 대한 설명
<section>
<h2>용어</h2>
<dl>
<dt><dfn>절대URL</dfn></dt>
<dd>web address사양에 정의된 절대 web address</dd>
<dt><dfn>웹표준</dfn></dt>
<dd>웹 사이트의 규격화<dd>
</dl>
</section>dfn
약어
첫머리의 글자 표현
<p><abbr title="HyperText Markup Languang">html</abbr>은 홈페이지 제작시 사용 됩니다.</p>time
날짜와 시간
브라우저, 로봇 등의 그 일시를 정확히 지정
연월일 구분 시, 붙임표
연월일 시간 구분시, 대문자 T
시분초 구분시, 콜론
datetime : 컴퓨터가 읽을 수 있는 포맷으로 일시를 지정
pubdate : 부모요소의 article요소의 컨텐츠 게시 일시임를 나타내는 논리 속성
<time>2015-06-05</time>
<time>2015-06-05T11:26</time>
<time>2015-06-05T11:26:31</time>
<time>11:26</time>
<header>
<h1>재미있는 코딩하기</h1>
<!--문서 전체의 발행 일시를 표현-->
<p><time datetime="2015-06-05" pubdate="pubdate">2015년 06월 05일</time></p>
</header>
<p>제가 코딩한 것을 정리 해 보았습니다</p>
<article>
<header>
<h2>코딩하기</h2>
<!--이포스트의 발행일시를표현-->
<p><time datetime="2015-06-05" pubdate="pubdate">2015년 06월 05일</time></p>
</header>
<!--이전체의발행일시를 표현-->
<p><time datetime="2015-06-05" pubdate="pubdate">어제</time>코딩 한 목록을 보여드리겠습니다</p>
</article>code
프로그램 코드
프로그램에서의 함수명, 변수명, 메소드명, 속성명, XML HTML 등의 이름 표현
<span>지역 변수의 선언<code>var test = 'Keep going'</code></span>
<span>아래의 이미지<code>'test.jpg'</code></span>kbd
사용자가 입력한 텍스트
var
프로그램의 변수 또는 인수
sub
아랫첨자
<p>This text contains <sub>subscript</sub> text.</p>sup
윗첨자
<p>This text contains <sup>subscript</sup> text.</p>i
이텔릭체
소리, 분위기를 나타내는 텍스트 범위
분류용어, 기술용어 외국견언 사고배의 이름 등의 표현
<p>너는<i>얼마나 멍청한가!</i>라고 생각했다.누구도 그가<i>바보</i>라고 생각했지만 그는 엄청난<i>천재</i>였다</p>b
표현에 있어서 굵은 글씨 표현
다른 문장과 구분시 사용
강조나 중요성은 나타내지 않음
<p>별이<b>반짝반짝</b>빛이 납니다</p>mark
하이라이트
대상을 다른 부분에 참조할 목적
특정 텍스트 범위 강조
<p>그는 말했습니다</p>
<blockquote>
<p>다른이에게 상처를 주면<mark>그상처는 다시 돌아온다</mark>라고 말했습니다.</p>
</blockquote>
ruby, rt, rp
ruby : 루비를 표시한 텍스트 표현
rt : 루비 텍스트
rp : 루비 ruby를 지원하지 않는 브라우저에 루비를 괄호에 넣어 표시
<p><ruby>禹민지<rt>우민지</rt></ruby>입니다</p>
<p>
<ruby>禹민지<rp><rt>우민지</rt></rp></ruby>
</p>s
더이상의 정확하지 않은 의미 또는 관련이 없어짐을 나타냄
취소선으로 표현, 삭제 되었다는 del요소 사용
<h2>하드가격인하</h2>
<p><s>희망 소매가격 - 210000</s></p>
<p><strong>하루 세일로 150000</strong></p>u
텍스트에 라벨을 달고 싶을 경우
중국어 고유명사 또는 단어의 철자 표현
<p>지도상<u>대천댐</u>라고 써있지만 사실은<em>대청댐</em>이었다</p>
<p><strong>하루 세일로 150000</strong></p>wbr
줄바꿈 허용 시 적용
