본문 바로가기

[Mobile] HTML5 추가된 태그

1. figure와 figcaption Element

웹 문서안의 사진이나 그림에 설명글을 넣는 태그


<!-- [css] figcaption {display:block;} --> <figure> <img src ="pic1.jpg" title="진달래꽃" /> <img src="pic2.jpg" title ="개나리꽃" />  <img src="pic3.jpg" title ="벚꽃" /> <figcaption> 봄에 피는 꽃입니다 </figcaption> <figure>


2. address Element

    제작자의 연락처 정보와 피드백 정보를 제공하는 태그


3. mark Element

text에 형광펜으로 그은 것과 같은 표시를 하고자 할 때 사용하는 태그


<p> <mark>독도</mark>는 
    <ruby> 大韓民國 <rt>대한민국</rt> </ruby> 
    땅이다! </p>


독도 大韓民國 대한민국 땅이다!



4. hr 태그

   웹페이지 안에 주제가 바뀔 때 사용. <p>태그 대신 사용


5. details태그

   웹페이지의 세부정보나 일부에 대해 설명할 때 사용

  <details>태그 속성에 open, close 를 설정하며  속성 close시 제목 클릭하면 세부내용 열림.


<details close>
  <summary>복사중...
    <progress max="375505392" value="97543282"></progress>25%</summary>
  <dl>
<dt>초당 전송량:</dt> 
    <dd>452KB/s</dd>
<dt>복사할 파일명:</dt> 
    <dd>/home/rpausch/raycd.m4v</dd>
<dt>대상 파일명:</dt> 
    <dd>/var/www/lectures/raycd.m4v</dd>
<dt>걸린시간:</dt> 
    <dd>01:16:27</dd>
<dt>영상 크기:</dt> 
    <dd>320×240</dd>
  </dl>
</details>


복사중... 25%
초당 전송량:
452KB/s
복사할 파일명:
/home/rpausch/raycd.m4v
대상 파일명:
/var/www/lectures/raycd.m4v
걸린시간:
01:16:27
영상 크기:
320×240


'Box > Mobile' 카테고리의 다른 글

[Mobile] HTML5 추가된 태그  (0) 2013.01.11
[Moblie] html5 Web Form  (0) 2013.01.09
[Moblie] meta 태그와 link  (0) 2013.01.09