html5의 주요 구조 요소는 무엇입니까-프런트엔드 Q&A-php.cn

html5의 주요 구조 요소는 무엇입니까

青灯夜游

풀어 주다： 2022-02-25 17:15:04

원래의

5861명이 탐색했습니다.

HTML5의 주요 구조 요소는 다음과 같습니다. 1. 독립적인 콘텐츠를 정의하는 기사 요소 2. 문서의 섹션을 정의하는 섹션 요소 3. 탐색 링크 부분을 정의하는 nav 요소 문서의 사이드바 부분을 정의합니다. 5. 날짜 또는 시간을 정의하는 시간 요소입니다.

html5의 주요 구조 요소는 무엇입니까

이 튜토리얼의 운영 환경: Windows 7 시스템, HTML5 버전, Dell G3 컴퓨터.

주요 구조 요소는 의미 체계를 구조화하고, 더 나은 SEO를 위해, 브라우저가 데이터를 더 잘 캡처할 수 있도록 하기 위한 것입니다. 포함되는 요소에는 주로 기사, 섹션, 탐색, 옆 및 시간이 포함됩니다.

article 요소

article 태그는 의미상 문서 또는 페이지입니다. 사용법: 일반적으로 기사, 페이지, 독립적인 완전한 콘텐츠입니다. 독립성에 중점을 두고 있습니다. 기사는 서로 중첩될 수 있으며 일반적으로 특수 섹션 요소로 간주될 수 있는 헤더 태그를 갖습니다(나중에 설명됨). 자주 사용되는 코드는 다음과 같습니다:

<!DOCTYPE HTML>
<html>
<body>
<article>  
  <header>    
    <h1> apple教程</h1>   
    <p>时间：<time pubdate="pubdate">2013-2-1</time></p>   
  </header>   
  <p>轻松学习apple教程，就来</p>
  <a href="http://www.apple.com">www.apple.com</a><br />   
  <footer>  
    <p><small>底部版权信息：apple.com公司所有</small></p>   
  </footer>  
 </article>
</body>
</html>

로그인 후 복사

section 요소

Section 요소 의미는 섹션, 사용법: 기사의 섹션과 같이 페이지의 특정 콘텐츠 섹션에 사용되며 일반적으로 제목과 내용으로 구성됩니다. . 제목이 없는 부분은 권장되지 않습니다. 기사가 더 독립적이기 때문에 섹션은 기사 요소를 중첩할 수 있습니다. 사용 빈도가 낮고 분할 및 청킹에 중점을 둡니다. 코드는 다음과 같습니다.

<!DOCTYPE HTML>
<html>
<body>
   <section>
   <h2>section元素使用方法</h2>
    <p> section元素用于对网站或应用程序中页面上的内容进行分块。</p>
   </section>
</body>
 </html>

로그인 후 복사

Note: 컨테이너에 스타일을 지정하거나 instep을 정의해야 하는 경우 p를 사용하는 것이 좋습니다. 섹션을 사용하지 마세요.

nav 요소

nav 요소 의미는 탐색입니다. 사용법: 일반적으로 페이지 탐색 부분으로 사용되며 자주 사용됩니다. 코드는 다음과 같습니다:

<html>
<body>
<nav>
    <ul>
        <li><a href="">菜单1</a></li>
        <li><a href="">菜单2</a></li>
        <li><a href="">菜单3</a></li>
    </ul>
</nav> 
</body>
 </html>

로그인 후 복사

aside element

aside 요소 의미는 next, side, 사용법입니다: 기사 태그에 사용될 때 관련 참고 자료, 명사 등 주요 콘텐츠의 보조 정보 부분으로 사용됩니다. 설명 등 기사 태그 외부에서 사용되는 경우 사이드바, 블로그의 친숙한 링크 부분, 광고 영역 등과 같은 페이지나 사이트의 전체 보조 정보 부분 역할을 합니다. 사용빈도가 낮습니다. 코드는 다음과 같습니다.

<!DOCTYPE HTML>
<html>
<body>
<!-- 在article标签内使用时 -->
<article>
    <h1>马云是谁</h1>
    <p>马云，男，1964年10月15日出生于浙江省杭州市，中国著名企业家，阿里巴巴集团、淘宝网、支付宝创始人..........</p>
    <aside>
        <h1>参考资料</h1>
        <p>百度网、维基百科...</p>
    </aside>
</article>
 
<!-- 在article标签外使用时 侧导航栏-->
<aside>
    <nav>
        <ul>
            <li><a href="">老赵的博客</a></li>
            <li><a href="">鬼哥的博客</a></li>
            <li><a href="">彪叔的博客</a></li>
        </ul>
    </nav>
</aside> 
</body>
</html>

로그인 후 복사

time 요소

time 요소는 시간 태그입니다. 사용법: 특정 순간 또는 24시간 내의 특정 날짜를 나타냅니다. 순간을 표현하는 경우 시차가 허용됩니다. 날짜 및 시간을 다양한 형식으로 정의할 수 있으며 사용 빈도가 낮습니다. 코드는 다음과 같습니다:

<!DOCTYPE HTML>
<html>
<meta charset=&#39;utf-8&#39;>
<body>
<aside>
    <time datetime="2013-3-6">2014年3月6日</time>
    <br/>
    <!-- datetime属性中日期与时间之间要用“T” 文字分隔，“T”表示时间 -->
    <time datetime="2013-3-6T20:00">2014年3月6日20:00</time>
    <br/>
    <!-- 时间加上“Z”表示给机器编码时使用UTC标准时间 -->
    <time datetime="2013-3-6T20:00Z">2014年3月6日20:00</time> 
</aside> 
</body>
</html>

로그인 후 복사

위 내용은 html5의 주요 구조 요소는 무엇입니까의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!