DEVELOPE/HTML-HTML5
html5 time 태그 & 마이크로포맷
소찾나
2017. 11. 29. 08:10
html5 time 태그 & 마이크로포맷
html5 time 태그 & 마이크로포맷
전화번호나 소속, 메일주소, 날짜등과 같은 별도의 정보를 마이크로 포맷(micorformats) 이라고 합니다.
html4 에서는 마이크로 포맷을 표현할 수 있는 기능이 없었지만 html5 에서는 날짜와 시간 정보를 표현
할 수 있는 마이크로 포맷 태그인 <time> 태그를 제공한다.
1 <time> 태그
html4 에서는 날짜를 웹 문서에 삽입하려면 다음과 같이 <div> 태그를 이용해서 클래스 이름을 따로 지정해 주어야 했다.
1 2 3 4 | <div class="time"> <p class="write-date">2017년 11월 29일</p> <h2>작성일</h2> </div> | cs |
하지만 html5 에서는 <time> 태그를 사용하면 이를 대신할 수 있다. <time> 태그를 지정하면 브라우저에서 바로 날짜를 인식할 수 있
습니다.
1 | <time datetime="2017-11-29" pubdate>2017년 11월 29일</time> | cs |
datetime 은 브라우저에서 인식하는 날짜로 표현방식은 yyyy-mm-dd 형식을 따른다.
pubdate 는 0 또는 1의 값을 가지므로 필요한 때만 삽입
2017년 11월 29일은 브라우저에 표시되는 날짜로 알아보기 쉽게 표시하면 된다.
1 | <time datetime="2017-11-29T08:01:00" pubdate>2017년 11월 29일</time> | cs |
<time> 태그는 시간도 표현할 수 있는데 표현 방식은 위에서 처럼 T 를 붙여서 시간을 표시하여 준다