HTML入門6

來源:互聯網
上載者:User

標籤:無法找到   section   seo   選擇   常見   功能   全域   水平線   特性   

  這篇將簡單會編寫網頁整體網站架構,通過HTML來表示網站結構。

  標題<header>,通常頂部有個大標題或表徵圖,是網站的主要常見資訊,存在於每個網頁

  導航<nav>,通常包含功能表按鈕、連結、選項卡,要跳轉的導航內容與相應的網頁保持一致

  主要內容<main>,中心大地區包含網頁給定的大部分獨特內容,

  側欄 <aside>主要是一些次要資訊,連結,引言,廣告等,也可以是一些導航輔助系統;經常嵌套在<main>中

  頁尾<footer>, 橫跨頁面底部的條紋,通常包含著作權。聯絡想你洗,放置公用資訊的地方,也提供快速存取熱門內容的連結,頁尾也用於引擎SEO,

  用於結構化網站的HTML

  需要用正確的元素來語義化工作,恰好這些語義化元素能夠被閱讀器所識別。

  布局元素細節,總體上把握包含header    nav   main  footer  .然後main裡麵包含article和aside

<main> 展現頁面內容特性,只可以在一個頁面使用一次,直接放在body裡理想情況下,不應該把他嵌套在別的元素中。

<article> 閉合一塊與自身相關的內容,這塊內容能夠詳細區段視它自身而不是頁面其他內容

<section> 類似於<article>被作為一個部分,區塊,標題的一部分,吧不同的section分到不同的article裡

<aside> 包含的內容不與主要內容有直接聯絡,通常放一些術語表條目,輔助菜單,相關連結等

<header> 展現一些介紹性內容,如果它是body的子項目,它就定義網站的全域頁首,當然它還可以用於article部分的,當其充當article的子項目是,它就定義了這部分特定的頁首,

<nav> 包含了頁面主要的導航功能,二級連結,不會進入導航功能部分

<footer> 包含頁面的頁尾部分

  沒有特定語義的裝飾元素

  <div><span>無語義元素,在使用的時候最好用一些class屬性來提供一些標籤,容易被找到

其中span 是行內無語音元素,只有當無法找到更合適的語義元素包含內容時再使用;div塊級無語音元素,同樣也是在找不到更合適的時候選用;打個比方,你要想做一個購物車組件,考慮到和之內容不存在必要聯絡,所以不能用aside,也不是頁面內容的一部分也不能用section,此時選擇div比較合適,為了語義化,應該將div的使用量降到最低,因為不利於升級和維護;

  換行和水平分割線

<br><hr> 著兩個元素代表換行和水平分割線, 產生一系列的短行的地方,<br>是唯一能夠產生這種結構的元素;<hr>水平線,

 

  

 

 

  

HTML入門6

相關文章

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.