HTML標籤-----article、aside、figure、nav和section
阿新 • • 發佈:2019-01-04
article
<article> 標籤定義獨立的內容
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> </head> <body> <div>article標籤</div> <article> <h1>Internet Explorer 9</h1> <p>Windows Internet Explorer 9(簡稱 IE9)於 2011 年 3 月 14 日釋出.....</p> </article> </body> </html>
aside
<aside> 標籤定義 <article> 標籤外的內容,aside 的內容應該與附近的內容相關
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> </head> <body> <p>My family and I visited The Epcot center this summer.</p> <aside> <h4>Epcot Center</h4><p>The Epcot Center is a theme park in Disney World, Florida.</p> </aside> </body> </html>
figure
<figure> 標籤規定獨立的流內容(影象、圖表、照片、程式碼等等),figure 元素的內容應該與主內容相關,但如果被刪除,則不應對文件流產生影響
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> </head> <body> <p>上海盧浦大橋是當今世界第一鋼結構拱橋,是世界上跨度最大的拱形橋。</p> <figure> <p>黃浦江上的的盧浦大橋</p> <p>拍攝者:W3School 專案組,拍攝時間:2010 年 10 月</p> <img src="img/bridge.jpg" width="350" height="250" /> </figure> </body> </html>
nav
<nav> 標籤定義導航連結的部分
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> </head> <body> <nav> <a href="#">Java</a> <a href="#">C#</a> <a href="#">JavaScript</a> </nav> </body> </html>
section
<section> 標籤定義文件中的節(section、區段)。比如章節、頁首、頁尾或文件中的其他部分
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> </head> <body> <section> <h1>Java</h1> <p> Java是一門語言! </p> </section> <section> <h1>C#</h1> <p> C#是一門語言! </p> </section> <p> C#是一門語言! </p> </body> </html>