html5新增元素主体结构

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>html5的新增主体结构元素</title>
</head>
<body>
   <!-- 可添加 ul li ,用css制作导航条
   
     nav的应用场合:
      
      网页导航栏:
      
      侧面导航栏:
      
      页内导航:
      
      翻页操作:
      
    不可用 menu代替nav,menu用在发出一系列命令的导航上,是一种交互性元素
   
    -->
   <nav>首页   新闻  <a href="#">IT</a>   <a href="#">时尚</a>   影视    数码</nav>
   
  <article>
    
      <header>
        <h3>一篇报道</h3>
        <!-- pubdate 属性表示网页或者文章的发布日期,当有多个时间时可明确区分 -->
        
        <!-- time属性
        微格式是html利用class属性来对网页添加附加信息的方法,
        
        time属性表示24小时中的某个时刻或日期,表示时刻时允许带时差 ,
        编码时机器读到的是datetime中的值,标签之间的内容显示在网页上...
         -->
        
        <span>发表时间:<time datetime="2010-10-21T10:10"  pubdate="pubdate">2010-10-21</time></span>
      </header>
      
      <!-- 
      section :将内容分块显示
       -->
      <section>
        
           <h4> 新年首次离京:习主席察看鲁甸地震遗址</h4>
           <!-- 
           aside 作为名词解释
           
            -->
      <aside>
       <dl>
       <dt>新年</dt>
        <dd>新年快到了....</dd>
       </dl>
      </aside>
        <p>2015年首次离京考察,习主席总书记将第一站选在云南鲁甸地震灾区。19日下午,他乘车一路颠簸直奔峡谷中的震中龙头山镇,来到原镇政府所在的遗址,走进满是废墟的院子,询问地震伤亡、抗震救灾情况。展板上,地震前后的照片对比鲜明,他面色凝重。  

习主席察看板房学校

鲁甸地震造成龙头山镇中学、中心小学和幼儿园严重受损。习主席来到震后搭建的板房学校,伫立学校门口,一侧是林立的板房,另一侧是正在平整的土地,地方干部告诉总书记,中小学和幼儿园将在这里异地重建,争取今年8月底前学生全部搬入新学校。习主席还走进板房学校教室察看。

灾区群众作诗赠总书记

看到总书记,当地干部群众十分激动。一位干部说,明天是大寒节气,大伙连夜自发创作了一首诗送给总书记:“大寒节令送大爱,龙头喜降丰年雪,千户万户瞳瞳日,十万乌蒙尽开颜”。现场响起热烈的掌声。望着远处被白雪覆盖的山峦,总书记感叹,这里地理条件确实复杂。</p>
      
      </section>
    
      <section>
        
        <h4>习主席:“我一直牵挂着你们”</h4>
      <p>
      在板房学校,总书记对围拢来的干部群众说,地震带来重大损失,很多人失去亲人,我和你们一样难过。震后,我一直牵挂着你们:安置好没?能不能吃上一口热饭?孩子有没有学上?生病能不能治疗?现在我特别关心你们越冬和灾后重建情况,能不能尽早搬进新居?

习主席:灾后重建工作要统筹考虑

总书记叮嘱当地干部说,当前安置工作和灾后重建工作交叉在一起,要协调指挥,统筹有序安排,总体考虑设计。今后的产业发展问题不能拍脑瓜,要符合当地实际,把长远发展的基础打好。
      
      </p>
      </section>

        
      <section>
      
        <h4>习主席:扶贫切忌形式主义</h4>
      <p>
      鲁甸县地处乌蒙山连片特困地区。总书记说,当地一定要做好扶贫、救灾双重任务。扶贫工作是2020年全面建成小康的重点,也是最艰巨的一项任务,不能光喊口号,更不能搞形式主义,一定要真抓实干。要是到2020年还有几个连片贫困区依然如旧,就谈不上全面小康。

习主席安置点帐篷摸棉被:“暖和不暖和?”

习主席来到小寨镇甘家寨红旗社区过渡安置点,走进邹体富老俩口和孙子住的帐篷,吃饭、补助、新房规划、收入来源……他问得十分仔细。总书记摸了摸棉被:“暖和不暖和?”又指着帐篷问:“都加厚了?”干部说,灾区群众都配了棉帐篷、棉被和电热毯。

习主席察看安置点公共厨房:“菜便宜吗?”

由于甘家寨在地震中整体被毁,全村都被安置在红旗社区,并设立临时党支部、警务室、消防室、儿童活动室,习主席一一察看。看到公共厨房里每家都有电磁炉、电饭锅和炒锅,他很欣慰,还揭开一个锅盖,看到里面有菜,马上问:“菜是自己买吗?便宜吗?”

习主席叮嘱灾区干部再接再厉

临别时,阳光洒在院子里,格外温暖。安置点的群众围拢过来,习主席和大家一一握手后说,党中央始终惦记着大家,祝愿大家克服困难,生活一定会更好。他特地和几位当地干部握手,叮嘱说:“地震是一次考验,你们辛苦了。希望再接再厉,做好越冬工作,保质保量重建家园!” 

新闻资料:鲁甸地震

云南省昭通市鲁甸县位于云贵川三省接合部,总人口44.1万人,其中少数民族人口占1/5。2014年8月3日,鲁甸发生6.5级地震,震中位于龙头山镇,造成108.84万人受灾,617人死亡、112人失踪,3143人受伤,转移安置25.4万人。目前灾后重建工作正在紧张进行。
      </p>
      
      </section>  



    <!-- 
    section 用于网站中内容的分块,或者文章的分段 
     -->
    <section>
      <h3>评论:</h3>
      <!-- 
      section 中嵌套 article
       -->
      <article>
          <header>
           <h4>评论者:万佛洞</h4>
             <p>评论时间:<time datetime="2002-10-11">2002-10-11</time></p>
          </header>
          
          <p>灾区人民保重...</p>
        
      </article>
    
    </section>
  
  </article>
  
  
  <aside>
    <nav>
     <h2>
     外媒评论:
     </h2>
     
     <ul>
       <li><a>路透社</a></li>
        <li><a>东京日报</a></li>
         <li><a>纽约时报</a></li>
     </ul>
    </nav>
  
  </aside>
  
 <article>
 
    <header>
    
     <hgroup>
     <h2>文章主标题</h2>
     <h3>文章副标题</h3>
     </hgroup>
    <p>文章正文主体部分..................</p>
    
    </header>
 
 </article>
  
  <footer>
  
     <address>中国人民路南</address>
  </footer>

</body>
</html>


你可能感兴趣的:(html5新增元素主体结构)