HTML5 동영상강좌 바로가기

HTML 태그 - details

본문

 

HTML 태그 - details

<details>태그는 추가적인 정보나 사용자가 요청하는 정보를 나타낼 때 사용합니다. summary요소와 함께 쓰입니다. HTML5에서 추가되었습니다.

속성

open : 웹페이지를 불러올 때 사용자에게 자세한 내용을 보여줄 것인지를 지정합니다. 생략하면 자세한 내용은 숨겨집니다.


샘플

<!DOCTYPE html>
<html>
 <head>
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
          <meta name="author" content="코리아뉴스" />
  <title> html공부 </title>
  <link rel="stylesheet" type="text/css" href="default.css" / >
  <style type="text/css">
   body {
    color:red;
   }
  </style> 
 </head>
 <body>
  <section>
           <h1>details태그</h1>         
   <details>
   <summary> 웹표준제작 </summary> 
   <p> 웹페이지제작시 웹표준을 준수하여 제작합니다. </p> 
   </details> 
  </section>
  <div id="related">
   <p>영역 </p>
  </div>
  <footer>
      <address> 전화 : 031-574-3659, E-mail : master@koreanews.com </address> 
                             Copyright ⓒ 2013 Koreanews co.,  All Rights Reserved.
  </footer>
 </body> 

</html> 

  • 트위터로 보내기
  • 페이스북으로 보내기
  • 구글플러스로 보내기
  • 카카오톡으로 보내기


HTML5 동영상강좌 바로가기