簡單的HTML5初步入門教學_html5教學技巧

HTML5 代表未來；W3C ( World Wide Web Consortium, 萬維網聯盟) 已經放棄 XHTML，從而使 HTML5 成為正式標準並得到認可。

HTML5 是下一代的 HTML。
HTML5 將成為 HTML、XHTML 以及 HTML DOM 的新標準，目標是取代現有的HTML4.01和XHTML1.0標準。它希望能減少網路豐富應用（RIA)對Flash、Silverlight、JavaFX等的依
賴，並且提供更多能有效增強網路應用的API。
HTML 的上一個版本誕生於 1999 年。自從那以後，Web 世界已經經歷了巨變。
HTML5 仍處於完善之中。然而，大部分現代瀏覽器已經具備了某些 HTML5 支援。
HTML5 是 W3C 與 WHATWG 合作的結果。
WHATWG 致力於 web 表單和應用程序，而 W3C 則專注於 XHTML 2.0。在 2006 年，雙方決定進行合作，來建立一個新版本的 HTML。
為 HTML5 建立的一些規則：
新特性應該是基於 HTML、CSS、DOM 以及 JavaScript。
減少對外部插件的需求（例如 Flash）
更優秀的錯誤處理
更多取代腳本的標記
HTML5 應該獨立於設備
開發進程應對公眾透明

最簡單的 HTML5 文件

XML/HTML Code複製內容到剪貼簿

1. html>  
2. title>A Tiny HTML DocumentA Tiny HTML DocumentA Tiny HTML Document >title>
  
3. p>Let's rock the browser, 155 🎜>p>  

只包含一行文字的超簡單的 HTML5 文檔，它在瀏覽器中效果如下：

更常見的結構用

和 來分塊，把頁面的資訊和頁面的實際內容分開，並用來封裝整個文檔，現在的文檔樣子如下：

XML/HTML Code複製內容到剪貼簿

1. html>  
2. html>  
3. head>  
4.   title>A Tiny HTMLA Tiny HTMLtitle>  
5. head>  
6. body>  
7.   p>Let's rock the 🎜>p>  
8. body>  
9. html>  

   、

   和 HTML5 不要求這些元素，但是這種書寫風格比較好。

   HTML5 文件類型

   XML/HTML Code複製內容到剪貼簿

   1. html>  

   
   第一行都必須是一個特定的文檔類型聲明，用於告訴後面的文檔標記遵循哪個標準。 HTML5 的文件類型聲明極為簡單。

   字元編碼

   現在大部分網站都使用 UTF-8 的編碼，這種編碼簡潔、轉換速度快，而且支援任何你想要的非英文字元。

   在 HTML5 中增加字元編碼資訊很簡單，在

   中增加 元素，如下：
   XML/HTML Code複製內容到剪貼簿

   1. head>  
   2.   meta charset charset>  
   3.   title>A Tiny HTMLA Tiny HTMLtitle>  
   4. head>  

   
   

   Dreamweaver 設計工具在建立新的網頁時會自動新增此元訊息，也會將檔案儲存為 UTF 編碼格式。如果你使用的是最簡單的文字編輯器，在儲存的時候記得選擇正確的編碼（UTF-8）。
   頁面語言
   指明網頁中使用的自然語言是一種好的習慣。為給內容指定語言，可在任何元素上使用 lang 屬性。
   為整個頁面新增語言說明，就是為 元素指定 lang 屬性，如下程式碼：
   XML/HTML Code複製內容到剪貼簿

   1. html lang=lang=lang
   =

   " >

   >

     
   

   如果頁麵包含多種語言的文本，那麼這個資訊細節對於螢幕閱讀器也是很有用的。 新增樣式表 只要是經過刻意設計的專業網站，就一定會使用樣式表。指定要使用的 CSS 樣式表時，需要在 中增加 元素，如下：

   XML/HTML Code複製內容到剪貼簿

   1. head>  
   2.   meta charset charset>  
   3.   title>A Tiny HTMLA Tiny HTMLtitle>  
   4.   link rel rel==rel==rel> 🎜> 
   href
   5. ="TinyHTML5.css">
   head

   >

     
   

   新增 JavaScript 在 HTML5 中加入 JavaScript 與在傳統頁面上新增差不多，例如：

   XML/HTML Code
   1. 複製內容到剪貼簿 head
   2. >     meta charset 
   charset
   3. >     title>A Tiny HTMLA Tiny HTML
   4. title>     link rel rel==rel> 🎜>
    
   5. href="TinyHTML5.css">  script src=src>=
   >
   6. script>  

   head
   

   >
     
   沒有必要加入 language=”JavaScript」屬性。瀏覽器假定你要使用的 JavaScript。

   特別注意： 如果你要在IE 中花很多時間測試包含JavaScript 的頁面，還應該增加一個特殊的註釋，叫Web標誌（saved from url=），這行註釋要放在指定字元編碼元素的後面，如下： XML/HTML Code複製內容到剪貼簿

   1. head>  
   2.   meta charset charset>  
   3.     
   4.   title>A Tiny HTMLA Tiny HTMLtitle>  

   
   

   這條註釋告訴IE 將頁面視為從遠端網站上下載下來的，否則，IE 會切換到一種特殊鎖定模式，彈出一條安全警告，在你點了“允許阻止的內容”按鈕之後才會執行JavaScript 程式碼。
   (0014) 指的​​是 about:internet 字串的長度。
   最終結果
   一個完整美觀的 HTML5 程式碼最終如下：
   XML/HTML Code複製內容到剪貼簿

   1. html>  
   2. html lang=lang=lang
   3. =lang=lang ">
     
   4. head>     
   meta
   5.  charset 
   charset
   6. >          
   7. title>A Tiny HTMLA Tiny HTMLtitle>     link rel 
   8. rel==rel> 🎜> href="TinyHTML5.css">  script 
   src
   9. =src>=>
   script
   10. >
     
   11. head>
     
   12.    body>  
     
   13. p>Let's rock the 🎜>p>
   14.    body>

     
   html>