筆記 - HTML5網頁設計初窺(2)

          講師:蘇鵬 
              布局發展概況
                  網頁中的布局與塊
                      DIV + id:url重寫技術
                          footer, top, main,
                      亂而無序
                  新的布局標記
                      header,hgroup,article,section,aside,footer
                      專注于內容,不專注于形式
                      所有標記 http://www.w3.org/TR/html-markup/ 
              新布局元素概述 
              從頭開始
                 Header:出現在頁面最前面的內容
                      
                  hgroup:在header里的
                      <header>
                          <img>
                          <hgroup>
                               <h1>
                               <h2>
                           </hgroup>
                      </header>
                  大塊文章
                      <article>
                          <img>
                          <h2>
                          <address>
                          <time>
                      </article>   
                  日期和時間
                  <address>
                      Written by w3schools.com <br />
                  <a href="mailto:us@example.ort">Email us</a> <br />
                  Address: Box 564, Disneyland<br />
                  Phone:+12 34 56 78
                  </address>
                  
                  <p>I have a date on <time datetime="2008-02-14">Valentines day</time></p>
                  <p>We open at <time>10:00</time> every morning.</p>

                  推薦使用第一種
              Footer    
                  <footer>
                      <p>   
                      <nav>
                          <h3>
                          <div>
                              <a>
                           </div>
                      </nav>
                  </footer>
              區域與塊
                  Aside
                  section
              整體布局
                  兩類控件:內容控件+功能控件
              與布局無關的
                  Figure
                  Figcaption
                  <figure>
                      <p>A view of the pulpit rok in Norway</p>
                      <img src="img_pulpit.jpg" width="304" height="228" />
                  </figure>
              漢字元素
              Ruby
                  <ruby>
                      韓<rt>safsdf</rt>
                  </ruby>    
              Time
              日期
                  Compontent                 syntax            Example
                  Date                            yyyy-mm-DD    2011-07-13
                  Time with hours             hh:mm            18:28
                  Time with seconds           hh:mm:ss        18:28:05
                  Time with milliseconds       hh:mm:ss.f    18:28:05.2318
                  Date and time                T to join date and 2011-07-12718:28
                                                          time
                  With time zone GMT        Z at the end        2011-07-13T18:28:05Z
                  With time zone as offset    +mm:hh / -mm:hh    2011-07T18:28:05+02:00

          總結:
                  新的布局方式
                      新標簽:為搜索引擎提供友好支持,后續操作的方便。
                                 html4有沒有辦法一下切換到html5
                   精髓:在API上,為了方便切換到html5,現在規范css,往html5現有的規范邊上靠,使用w3c的標記。

          posted on 2012-03-04 22:44 joinchen 閱讀(211) 評論(0)  編輯  收藏


          只有注冊用戶登錄后才能發表評論。


          網站導航:
           
          <2012年3月>
          26272829123
          45678910
          11121314151617
          18192021222324
          25262728293031
          1234567

          導航

          統計

          常用鏈接

          留言簿

          隨筆檔案

          搜索

          最新評論

          閱讀排行榜

          評論排行榜

          主站蜘蛛池模板: 昌平区| 岑溪市| 呼和浩特市| 华阴市| 大连市| 宁城县| 余江县| 始兴县| 中宁县| 全椒县| 松滋市| 北碚区| 昭通市| 三穗县| 江城| 大洼县| 肃宁县| 沙洋县| 庆安县| 卢龙县| 乐亭县| 梅州市| 舞钢市| 溧阳市| 峨眉山市| 吴川市| 怀仁县| 日土县| 夏津县| 浮山县| 佛山市| 新营市| 新野县| 武定县| 平遥县| 吉林省| 丹东市| 休宁县| 克山县| 遂平县| 涡阳县|