更新時間:2021-03-24 來源:黑馬程序員 瀏覽量:
aside元素用來定義當前頁面或者文章的附屬信息部分,它可以包含與當前頁面或主要內(nèi)容相關(guān)的引用、側(cè)邊欄、廣告、導(dǎo)航條等其他類似的有別于主要內(nèi)容的部分。
aside元素的用法主要分為兩種。
● 被包含在article元素內(nèi)作為主要內(nèi)容的附屬信息。
● 在article元素之外使用,作為頁面或站點全局的附屬信息部分。最常用的使用形式是側(cè)邊欄,其中的內(nèi)容可以是友情鏈接、廣告單元等。
下面通過一個案例對aside元素的用法進行演示,如下所示。
<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <title>aside元素的使用</title> </head> <body> <article> <header> <h1>標題</h1> </header> <section>文章主要內(nèi)容</section> <aside>其他相關(guān)文章</aside> </article> <aside>右側(cè)菜單</aside> </body> </html>
上面案例中定義了兩個aside元素,其中第1個aside元素位于article元素中,用于添加文章的其他相關(guān)信息。第2個aside元素用于存放頁面的側(cè)邊欄內(nèi)容。
效果如下圖所示
猜你喜歡: