介紹

10年積累的成都網站制作、做網站經驗，可以快速應對客戶對網站的新想法和需求。提供各種問題對應的解決方案。讓選擇我們的客戶得到更好、更有力的網絡服務。我雖然不認識你，你也不認識我。但先網站設計后付款的網站建設流程，更有莫力達免費網站建設讓你可以放心的選擇與我們合作。

HTML 5: 區(qū)塊元素

區(qū)塊元素 - body, article, section, header, footer, h1, h2, h3, h4, h5, h6, hgroup, aside, nav, address

示例

1、body - 用于定義文檔的主體element/section/body.html

 
 
 

  
  
  
 
  
  
  
 
  
  
  
 
  
  
  
     
  
  
  
 
  
  
  
 
  
  
  
 
  
  
  
 
  
  
  
     
  
  
  
        var body = document.body;  
  
  
  
 
  
  
  
        body.onafterprint = function () { alert("onafterprint"); };  
  
  
  
        body.onbeforeprint = function () { alert("onbeforeprint"); };  
  
  
  
        body.onbeforeunload = function () { alert("onbeforeunload"); };  
  
  
  
        body.onblur = function () { alert("onblur"); };  
  
  
  
        body.onerror = function () { alert("onerror"); };  
  
  
  
        body.onfocus = function () { alert("onfocus"); };  
  
  
  
        body.onhashchange = function () { alert("onhashchange"); };  
  
  
  
        body.onload = function () { alert("onload"); };  
  
  
  
        body.onmessage = function () { alert("onmessage"); };  
  
  
  
        body.onoffline = function () { alert("onoffline"); };  
  
  
  
        body.ononline = function () { alert("ononline"); };  
  
  
  
        body.onpagehide = function () { alert("onpagehide"); };  
  
  
  
        body.onpageshow = function () { alert("onpageshow"); };  
  
  
  
        body.onpopstate = function () { alert("onpopstate"); };  
  
  
  
        body.onresize = function () { alert("onresize"); };  
  
  
  
        body.onscroll = function () { alert("onscroll"); };  
  
  
  
        body.onstorage = function () { alert("onstorage"); };  
  
  
  
        body.onunload = function () { alert("onunload"); };  
  
  
  
     
  
  
  
 
  
  
  
 
 
 
 

2、article - 用于定義一段完整且獨立的內容element/section/article.html

 
 
 

  
  
  
 
  
  
  
 
  
  
  
 
  
  
  
     
  
  
  
 
  
  
  
 
  
  
  
     
  
  
  
    
 
  
  
  
        我是一段完整且獨立的內容  
  
  
  
     
  
  
  
 
  
  
  
 
 
 
 

3、section - 用于定義文檔內容中的某一部分element/section/section.html

 
 
 

  
  
  
 
  
  
  
 
  
  
  
 
  
  
  
     
  
  
  
 
  
  
  
 
  
  
  
    
 
  
  
  
         
  
  
  
        
我要學習 html5
 
  
  
  
        
我要學習 flash
 
  
  
  
        
我要學習 silverlight
 
  
  
  
     
  
  
  
 
  
  
  
 
 
 
 

4、header - 定義文檔的頁眉element/section/header.html

 
 
 

  
  
  
 
  
  
  
 
  
  
  
 
  
  
  
     
  
  
  
 
  
  
  
 
  
  
  
    
 
  
  
  
         
  
  
  
        
學什么呢？
 
  
  
  
        
我要學習 html5
 
  
  
  
        
我要學習 flash
 
  
  
  
        
我要學習 silverlight
 
  
  
  
     
  
  
  
 
  
  
  
 
 
 
 

5、footer - 定義文檔的頁腳element/section/footer.html

 
 
 

  
  
  
 
  
  
  
 
  
  
  
 
  
  
  
     
  
  
  
 
  
  
  
 
  
  
  
    
 
  
  
  
        
學什么呢？
 
  
  
  
        
我要學習 html5
 
  
  
  
        
我要學習 flash
 
  
  
  
        
我要學習 silverlight
 
  
  
  
         
  
  
  
         
  
  
  
     
  
  
  
 
  
  
  
 
 
 
 

6、h1 h2 h3 h4 h5 h6 - 用于定義 6 種不同級別的標題，h1 為最大標題，h6 為最小標題element/section/h1_h2_h3_h4_h5_h6.html

 
 
 

  
  
  
 
  
  
  
 
  
  
  
 
  
  
  
     
  
  
  
 
  
  
  
 
  
  
  
    
 
  
  
  
        
 
  
  
  
             
  
  
  
            
學什么呢？
 
  
  
  
         
  
  
  
        
我要學習 html5
 
  
  
  
        
我要學習 flash
 
  
  
  
        
我要學習 silverlight
 
  
  
  
         
  
  
  
     
  
  
  
 
  
  
  
 
 
 
 

7、hgroup - 用于對文檔某段內容的標題進行組合，使用 h1 h2 h3 h4 h5 h6 來標記標題的級別element/section/hgroup.html

 
 
 

  
  
  
 
  
  
  
 
  
  
  
 
  
  
  
     
  
  
  
 
  
  
  
 
  
  
  
    
 
  
  
  
        
 
  
  
  
            
 
  
  
  
                學什么呢？  
  
  
  
             
  
  
  
         
  
  
  
         
  
  
  
        
 
  
  
  
            
webabcd 文章
 
  
  
  
            
談談學習
 
  
  
  
         
  
  
  
        
我要學習 html5
 
  
  
  
        
我要學習 flash
 
  
  
  
        
我要學習 silverlight
 
  
  
  
         
  
  
  
     
  
  
  
 
  
  
  
 
 
 
 

8、aside - 用于定義文檔以外的，但卻與文檔相關的內容element/section/aside.html

 
 
 

  
  
  
 
  
  
  
 
  
  
  
 
  
  
  
     
  
  
  
 
  
  
  
 
  
  
  
    
 
  
  
  
        
 
  
  
  
            
 
  
  
  
                學什么呢？  
  
  
  
             
  
  
  
         
  
  
  
        
 
  
  
  
            
webabcd 文章
 
  
  
  
            
談談學習
 
  
  
  
         
  
  
  
        
我要學習 html5
 
  
  
  
        
我要學習 flash
 
  
  
  
        
我要學習 silverlight
 
  
  
  
         
  
  
  
         
  
  
  
        
  
  
  
            我還寫了好多其他文章  
  
  
  
         
  
  
  
     
  
  
  
 
  
  
  
 
 
 
 

9、nav - 用于定義導航鏈接（nav 是 navigation 的縮寫）element/section/nav.html

 
 
 

  
  
  
 
  
  
  
 
  
  
  
 
  
  
  
     
  
  
  
 
  
  
  
 
  
  
  
    
 
  
  
  
        
 
  
  
  
            
 
  
  
  
                學什么呢？  
  
  
  
             
  
  
  
         
  
  
  
        
 
  
  
  
            
webabcd 文章
 
  
  
  
            
談談學習
 
  
  
  
         
  
  
  
        
我要學習 html5
 
  
  
  
        
我要學習 flash
 
  
  
  
        
我要學習 silverlight
 
  
  
  
         
  
  
  
        
  
  
  
             
  
  
  
             
  
  
  
         
  
  
  
     
  
  
  
 
  
  
  
 
 
 
 

10、address - 定義文檔作者的聯(lián)系信息element/section/address.html

 
 
 

  
  
  
 
  
  
  
 
  
  
  
 
  
  
  
     
  
  
  
 
  
  
  
 
  
  
  
    
 
  
  
  
        
 
  
  
  
            
 
  
  
  
                學什么呢？  
  
  
  
             
  
  
  
         
  
  
  
        
 
  
  
  
            
webabcd 文章
 
  
  
  
            
談談學習
 
  
  
  
         
  
  
  
        
我要學習 html5
 
  
  
  
        
我要學習 flash
 
  
  
  
        
我要學習 silverlight
 
  
  
  
        
  
  
  
             
  
  
  
            
 
  
  
  
                作者：webabcd，我的電話：911  
  
  
  
             
  
  
  
         
  
  
  
        
  
  
  
             
  
  
  
         
  
  
  
     
  
  
  
 
  
  
  
 
 
 
 

[源碼下載]

原文鏈接：http://www.cnblogs.com/webabcd/archive/2011/09/19/2180990.html

當前名稱：HTML5深入淺出教學篇之二
標題鏈接：http://m.fisionsoft.com.cn/article/dhcihhs.html