From a3cb768f710d274b572a26c48448f0cb8e4a1bdd Mon Sep 17 00:00:00 2001 From: MDN Date: Tue, 25 May 2021 00:43:56 +0000 Subject: [CRON] sync translated content --- .../zh-tw/orphaned/web/guide/html/html5/index.html | 109 +++++++++++++++++++++ .../html/html5/introduction_to_html5/index.html | 41 ++++++++ 2 files changed, 150 insertions(+) create mode 100644 files/zh-tw/orphaned/web/guide/html/html5/index.html create mode 100644 files/zh-tw/orphaned/web/guide/html/html5/introduction_to_html5/index.html (limited to 'files/zh-tw/orphaned/web/guide') diff --git a/files/zh-tw/orphaned/web/guide/html/html5/index.html b/files/zh-tw/orphaned/web/guide/html/html5/index.html new file mode 100644 index 0000000000..411dfc2fe8 --- /dev/null +++ b/files/zh-tw/orphaned/web/guide/html/html5/index.html @@ -0,0 +1,109 @@ +--- +title: HTML5 +slug: orphaned/Web/Guide/HTML/HTML5 +translation_of: Web/Guide/HTML/HTML5 +original_slug: Web/Guide/HTML/HTML5 +--- +

HTML5 是 HTML 標準中的最新版。在 HTML5 規格還未拍板定案之前,Mozilla 以及其他瀏覽器開發商已經著手實現其中的部分功能。本文所列的連結網址與相關內容,是 Mozilla  Gecko 解析引擎已經支援的部份,Firefox許多其他產品都使用 Gecko 解析引擎。

+ +

(這裡是 另一篇 HTML5 分類整理文章。)

+ +

HTML5 簡介

+ +
+
HTML5 簡介
+
這篇文章介紹如何在你的網頁設計或 Web 應用程式中使用 HTML5。
+
+ +

HTML5 元素

+ +
+
使用 audio 和 video {{ gecko_minversion_inline("1.9.2") }}
+
Firefox 3.5 開始支援 HTML5 {{ HTMLElement("audio") }} 和 {{ HTMLElement("video") }} 兩個元素。
+
HTML5 表單 {{ gecko_minversion_inline("2.0") }}
+
簡單介紹 HTML5 對於 Web 表單的改進項目:限制條件與驗證 API、多個新增的屬性、新增多個值供 {{ HTMLElement("input") }} 的 {{ htmlattrxref("type", "input") }} 屬性使用,並且新增 {{ HTMLElement("output") }} 元素。
+
Sections 和 outlines {{ gecko_minversion_inline("2.0") }}
+
HTML5 對於大綱與分段的支援元素包含有: {{ HTMLElement("section") }}、{{ HTMLElement("article") }}、{{ HTMLElement("nav") }}、{{ HTMLElement("header") }}、{{ HTMLElement("footer") }}、{{ HTMLElement("aside") }} 以及 {{ HTMLElement("hgroup") }}。
+
元素 {{ HTMLElement("mark") }} {{ gecko_minversion_inline("2.0") }}
+
元素 mark 被用在標註特別相關的重點文字。
+
元素 {{ HTMLElement("figure") }} 和 {{ HTMLElement("figcaption") }} {{ gecko_minversion_inline("2.0") }}
+
These elements lets you add figures and illustration, with an eventual caption, loosely coupled to the main text.
+
+ +

支援 Canvas

+ +
+
Canvas 導覽 {{ gecko_minversion_inline("1.8.1") }}
+
 學習如何使用新的 {{ HTMLElement("canvas") }} 元素,以及如何在 Firefox 中繪製圖表與其他物件。
+
<canvas> 元素的 HTML5 文字(text) API {{ gecko_minversion_inline("1.9.1") }}
+
{{ HTMLElement("canvas") }} 元素現在已經支援 HTML5 文字(text) API。
+
+ +

給 Web 應用程式的新功能

+ +
+
Firefox 中的離線資源(含 HTML5 Application Cache 介紹)  {{ gecko_minversion_inline("1.9.1") }}
+
Firefox 完整支援 HTML5 離線資源規格。
+
上線與離線事件 (Online and offline events) {{ gecko_minversion_inline("1.9") }}
+
Firefox 3 支援 WHATWG 的上線與離線事件,這讓應用程式與擴充套件可以偵測目前是否有可用的 Internet 連線,也可以偵測何時建立或結束這個網路連線。
+
WHATWG 用戶端 session 與持續性儲存 (persistent storage) (亦稱 DOM 儲存) {{ gecko_minversion_inline("1.8.1") }}
+
用戶端 session 與持續性儲存功能,讓 web 應用程式可以在用戶端儲存結構性資料。
+
屬性 contentEditable ,將你的網站變成 wiki ! {{ gecko_minversion_inline("1.9.1") }}
+
HTML5 已經將 contentEditable 屬性標準化。學習更多這個新功能。
+
在 web 應用程式中存取檔案 {{ gecko_minversion_inline("1.9.2") }}
+
Gecko 已經支援新的 HTML5 檔案 API,讓 web 應用程式可以存取使用者所選的本地端檔案。這個功能也包含使用檔案類型的輸入元素 {{ HTMLElement("input") }}  type file 的新屬性 multiple 來選取多個檔案。
+
+ +

DOM 新功能

+ +
+
getElementsByClassName
+
支援 Document 與 Element 節點的 getElementsByClassName 方法。這個方法允許藉由指定的一個或多個 class 尋找頁面中的元素。
+
拖曳功能 (Drag and drop)
+
HTML5 拖曳 API 支援在一個或多個網站之間拖曳物件。也提供了一個更簡化的 API 供擴充套件與 Mozilla-based 應用程式使用。
+
HTML Focus 管理
+
支援新的 HTML5 屬性:activeElementhasFocus
+
Web-based 協定處理器
+
你現在可以使用 navigator.registerProtocolHandler() 方法將 web 應用程式註冊成協定處理器 (protocol handlers)。
+
+ +

HTML 解析器

+ +

Gecko 的 HTML5相容解析器 — 負責將一份 HTML 文件字元們轉化為 DOM — 已經於 2010 年五月預設為啟用。(備忘:該 HTML5 解析器版本搭載於 Gecko 1.9.2 / Firefox 3.6 當中,是個不穩定的版本,並且不建議用於正式使用環境。)

+ +

其他

+ + + +

有些人自以為它是 HTML5 的一部分……XD

+ + + +

參考

+ + diff --git a/files/zh-tw/orphaned/web/guide/html/html5/introduction_to_html5/index.html b/files/zh-tw/orphaned/web/guide/html/html5/introduction_to_html5/index.html new file mode 100644 index 0000000000..8652e3229a --- /dev/null +++ b/files/zh-tw/orphaned/web/guide/html/html5/introduction_to_html5/index.html @@ -0,0 +1,41 @@ +--- +title: Introduction to HTML5 +slug: orphaned/Web/Guide/HTML/HTML5/Introduction_to_HTML5 +tags: + - HTML + - HTML5 +translation_of: Web/Guide/HTML/HTML5/Introduction_to_HTML5 +original_slug: Web/Guide/HTML/HTML5/Introduction_to_HTML5 +--- +

HTML5 是目前最新的HTML標準。它提供一些新特性,不只是支援多媒體,還讓網頁應用程式可以更容易、更有效地與使用者、伺服器互動。

+ +

目前,仍有一些瀏覽器未完全支援HTML5所有特性。但是使用Gecko解析引擎的Firefox已經對HTML5十分支持,現時還繼續開發去支援更多特性。Gecko已經在1.8.1版本開始支持一些HTML5 了。你可以在main HTML5 page找到Gecko解析引擎最近支援的HTML5特性列表。若要更仔細知道多種瀏覽器支援的情況,可瀏覽CanIUse

+ +

建立HTML5文件並宣告HTML5 doctype

+ +

要建立HTML5文件很簡單,只需要在文件開首宣告:

+ +
<!DOCTYPE html>
+
+ +

對於未支援HTML5標準的瀏覽器,瀏覽器會繼續解析,但要注意一些HTML5的新特性則會忽略、不會支援。

+ +

然而這個宣告方法比以前HTML版本更簡單、更短,更容易記憶,亦減少文件容量。

+ +

利用<meta charset>來宣告字符集

+ +

你需要首先指示瀏覽器要使用哪一種字符集。在以前版本,這需要複雜的<meta>完素;來到HTML5,這變得非常簡單:

+ +
<meta charset="UTF-8">
+ +

將它放置在<head></head>之間。若果你使用的字符集與瀏覽器預先設定的不一樣,瀏覽器會重新解析文件。另外,若你目前並非UTF-8字符集,建議你在網頁中自行設定。

+ +

為了加強安全,HTML5文件限制字符集需要兼容ASCII和最少8位元。

+ +

Using the new HTML5 parser

+ +

The parsing rule of HTML5, which analyzes the meaning of mark-up, has been more precisely defined in HTML5. Until the introduction of HTML5, only the meaning of valid mark-up was defined, meaning that as soon as one small error was made in the mark-up (most Web sites have at least one), the behavior was undefined. Essentially, it meant that all browsers behaved differently, which is no longer the case. Now, faced with errors in the mark-up, all compliant browsers must behave exactly in the same way.

+ +

This requirement helps Web developers quite a bit. While it is true that all modern browsers now use these HTML5 parsing rules, non-HTML5-compliant browsers are still used by some. Keep in mind that it's still highly recommended that one write valid mark-up, as such code is easier to read and maintain, and it greatly decreases the prominence of incompatibilities that exists in various older browsers.

+ +

Don't worry — you don't have to change anything on your Web site — the Web browsers' developers have done everything for you!

-- cgit v1.2.3-54-g00ecf