From dd4bba10e60c3b148091f5143687d46fcdc0c0a3 Mon Sep 17 00:00:00 2001 From: Hoarfroster Date: Mon, 29 Jul 2024 23:34:46 +0800 Subject: [PATCH 1/7] chore: maintain redirected links --- .../using_the_notifications_api/index.md | 2 +- files/zh-tw/web/api/response/index.md | 2 +- .../zh-tw/web/api/server-sent_events/index.md | 6 +++--- .../using_server-sent_events/index.md | 6 +++--- files/zh-tw/web/api/web_audio_api/index.md | 6 +++--- .../using_web_workers/index.md | 20 +++++++++---------- .../index.md | 6 +++--- .../getting_started_with_webgl/index.md | 8 ++++---- .../zh-tw/web/api/webgl_api/tutorial/index.md | 2 +- files/zh-tw/web/api/websocket/index.md | 2 +- files/zh-tw/web/api/websockets_api/index.md | 2 +- .../index.md | 2 +- files/zh-tw/web/api/webvtt_api/index.md | 4 ++-- .../web/api/window/popstate_event/index.md | 2 +- .../api/window/requestanimationframe/index.md | 6 +++--- .../xmlhttprequest/xmlhttprequest/index.md | 6 +++--- .../using_xmlhttprequest/index.md | 2 +- files/zh-tw/web/css/@font-face/index.md | 8 ++++---- files/zh-tw/web/css/_colon_lang/index.md | 2 +- files/zh-tw/web/css/box-shadow/index.md | 4 ++-- .../basic_concepts_of_flexbox/index.md | 4 ++-- files/zh-tw/web/css/css_grid_layout/index.md | 4 ++-- .../using_css_transitions/index.md | 6 +++--- files/zh-tw/web/css/grid-template/index.md | 2 +- files/zh-tw/web/css/index.md | 10 +++++----- .../creating_and_triggering_events/index.md | 2 +- files/zh-tw/web/html/attributes/index.md | 2 +- files/zh-tw/web/html/element/button/index.md | 2 +- .../web/html/element/fencedframe/index.md | 8 ++++---- files/zh-tw/web/html/element/footer/index.md | 2 +- .../web/html/element/input/submit/index.md | 2 +- files/zh-tw/web/html/element/script/index.md | 2 +- files/zh-tw/web/html/element/time/index.md | 2 +- files/zh-tw/web/html/element/wbr/index.md | 2 +- .../global_attributes/data-_star_/index.md | 2 +- .../quirks_mode_and_standards_mode/index.md | 2 +- .../http/basics_of_http/data_urls/index.md | 4 ++-- .../index.md | 10 +++++----- files/zh-tw/web/http/caching/index.md | 4 ++-- files/zh-tw/web/http/cookies/index.md | 2 +- files/zh-tw/web/http/cors/index.md | 8 ++++---- .../cross-origin_resource_policy/index.md | 4 ++-- .../web/http/headers/cache-control/index.md | 4 ++-- files/zh-tw/web/http/headers/dnt/index.md | 4 ++-- .../web/http/headers/x-frame-options/index.md | 4 ++-- files/zh-tw/web/http/index.md | 8 ++++---- files/zh-tw/web/http/status/451/index.md | 2 +- .../web/javascript/data_structures/index.md | 8 ++++---- .../index.md | 6 +++--- files/zh-tw/web/javascript/index.md | 4 ++-- 50 files changed, 112 insertions(+), 112 deletions(-) diff --git a/files/zh-tw/web/api/notifications_api/using_the_notifications_api/index.md b/files/zh-tw/web/api/notifications_api/using_the_notifications_api/index.md index 6bf32196f0b288..1bc87c0f6143e7 100644 --- a/files/zh-tw/web/api/notifications_api/using_the_notifications_api/index.md +++ b/files/zh-tw/web/api/notifications_api/using_the_notifications_api/index.md @@ -38,7 +38,7 @@ window.addEventListener("load", function () { }); ``` -> **備註：** Chrome 不允許於載入事件中呼叫 [`Notification.requestPermission()`](/zh-TW/docs/Web/API/Notification.requestPermission) (參閱 [issue 274284](https://code.google.com/p/chromium/issues/detail?id=274284))。 +> **備註：** Chrome 不允許於載入事件中呼叫 [`Notification.requestPermission()`](/zh-TW/docs/Web/API/Notification.requestPermission) (參閱 [issue 274284](https://bugs.chromium.org/p/chromium/issues/detail?id%3D274284))。 ### 已安裝的 Apps diff --git a/files/zh-tw/web/api/response/index.md b/files/zh-tw/web/api/response/index.md index 70f078e17dc200..6b34e1ea2c7403 100644 --- a/files/zh-tw/web/api/response/index.md +++ b/files/zh-tw/web/api/response/index.md @@ -64,7 +64,7 @@ slug: Web/API/Response ## 範例 -在[基本 fetch 範例](https://github.com/mdn/fetch-examples/tree/master/basic-fetch) ([run example live](http://mdn.github.io/fetch-examples/basic-fetch/)) 中，我們使用 `fetch()` 呼叫來得到圖片，並使用 {{htmlelement("img")}} tag 顯示。 這裡的`fetch()` 呼叫返回了一個 promise，它使用與資源 fetch 操作有關的 `Response` 進行解析。你可能有發現，由於我們要求的是一張圖片，所以需要用 {{domxref("Body.blob")}} ({{domxref("Response")}} 時做了 body) 讓 response 有正確的 MIME 類型。 +在[基本 fetch 範例](https://github.com/mdn/fetch-examples/tree/main/basic-fetch) ([run example live](https://mdn.github.io/fetch-examples/basic-fetch/)) 中，我們使用 `fetch()` 呼叫來得到圖片，並使用 {{htmlelement("img")}} tag 顯示。 這裡的`fetch()` 呼叫返回了一個 promise，它使用與資源 fetch 操作有關的 `Response` 進行解析。你可能有發現，由於我們要求的是一張圖片，所以需要用 {{domxref("Body.blob")}} ({{domxref("Response")}} 時做了 body) 讓 response 有正確的 MIME 類型。 ```js const image = document.querySelector(".my-image"); diff --git a/files/zh-tw/web/api/server-sent_events/index.md b/files/zh-tw/web/api/server-sent_events/index.md index 4f7613dc56e993..b79c979ea1b6eb 100644 --- a/files/zh-tw/web/api/server-sent_events/index.md +++ b/files/zh-tw/web/api/server-sent_events/index.md @@ -18,7 +18,7 @@ slug: Web/API/Server-sent_events - Remy Sharp's [EventSource polyfill](https://github.com/remy/polyfills/blob/master/EventSource.js) - Yaffle's [EventSource polyfill](https://github.com/Yaffle/EventSource) -- Rick Waldron's [jquery plugin](https://github.com/rwldrn/jquery.eventsource) +- Rick Waldron's [jquery plugin](https://github.com/rwaldron/jquery.eventsource) ## 相關主題 @@ -31,5 +31,5 @@ slug: Web/API/Server-sent_events ## 參見 - A [Twitter like application](http://hacks.mozilla.org/2011/06/a-wall-powered-by-eventsource-and-server-sent-events/) powered by server-sent events and [its code on Github](https://github.com/mozilla/webowonder-demos/tree/master/demos/friends%20timeline). -- [HTML5 and Server-sent events](http://dsheiko.com/weblog/html5-and-server-sent-events) -- [Server-sent events using Asp.Net](http://rajudasa.blogspot.in/2012/05/html5-server-sent-events-using-aspnet.html) +- [HTML5 and Server-sent events](https://dsheiko.com/weblog/html5-and-server-sent-events/) +- [Server-sent events using Asp.Net](https://www.blogger.com/blogin.g?blogspotURL%3Dhttp://rajudasa.blogspot.com/2012/05/html5-server-sent-events-using-aspnet.html%26type%3Dblog) diff --git a/files/zh-tw/web/api/server-sent_events/using_server-sent_events/index.md b/files/zh-tw/web/api/server-sent_events/using_server-sent_events/index.md index 91618fd45fb356..5cebd6c8d3ef1c 100644 --- a/files/zh-tw/web/api/server-sent_events/using_server-sent_events/index.md +++ b/files/zh-tw/web/api/server-sent_events/using_server-sent_events/index.md @@ -50,7 +50,7 @@ evtSource.addEventListener("ping", function (event) { 上述的程式碼大同小異，不同之處在於若伺服器傳送了 `event` 欄位值為「ping」的訊息時它就會把 `data` 欄位的值解析為 JSON 並輸出到畫面上。 -> **警告：** 當連線不是透過 **HTTP/2** 時，SSE 會受到最大連線數限制所苦，尤其當開啟多個分頁。每個瀏覽器有自己的限制數而且被限制在很低的數量（6）。這個問題已經被 [Chrome](https://bugs.chromium.org/p/chromium/issues/detail?id=275955) 和 [Firefox](https://bugzilla.mozilla.org/show_bug.cgi?id=906896) 標註為「Won't fix」（不修復）。限制是基於每個瀏覽器 + 網域，也就是說你可以針對 www\.example1.com 網域在所有的分頁中開啟六個 SSE 連線，另一個網域 www\.example2.com 也可以開啟六個（根據 [Stackoverflow](https://stackoverflow.com/a/5326159/1905229)）。當使用 HTTP/2 時最大同時 _HTTP streams_ 連線數是由伺服器和客戶端之間協調（預設 100）。 +> **警告：** 當連線不是透過 **HTTP/2** 時，SSE 會受到最大連線數限制所苦，尤其當開啟多個分頁。每個瀏覽器有自己的限制數而且被限制在很低的數量（6）。這個問題已經被 [Chrome](https://bugs.chromium.org/p/chromium/issues/detail?id=275955) 和 [Firefox](https://bugzilla.mozilla.org/show_bug.cgi?id=906896) 標註為「Won't fix」（不修復）。限制是基於每個瀏覽器 + 網域，也就是說你可以針對 www\.example1.com 網域在所有的分頁中開啟六個 SSE 連線，另一個網域 www\.example2.com 也可以開啟六個（根據 [Stackoverflow](https://stackoverflow.com/questions/5195452/websockets-vs-server-sent-events-eventsource/5326159#5326159)）。當使用 HTTP/2 時最大同時 _HTTP streams_ 連線數是由伺服器和客戶端之間協調（預設 100）。 ## 從伺服器發送事件 @@ -95,7 +95,7 @@ while (true) { 上述的程式碼會在每秒產生一個類型為「ping」的事件。每一個事件的資料是一個 JSON 物件，內容為事件產生時的 ISO 8601 時間戳。同時會隨機發送一個簡易訊息（沒有事件類型）。 迴圈的執行會獨立於連線的狀態，，所以在迴圈裡必須檢查連線的狀態，若斷線了要關閉連線（譬如，客戶端關閉了網頁）。 -> **備註：** 你可以從下列的 Github 文章中找到包含本文所使用程式碼的完整範例 —— 參考 [Simple SSE demo using PHP.](https://github.com/mdn/dom-examples/tree/master/server-sent-events) +> **備註：** 你可以從下列的 Github 文章中找到包含本文所使用程式碼的完整範例 —— 參考 [Simple SSE demo using PHP.](https://github.com/mdn/dom-examples/tree/main/server-sent-events) ## 錯誤處理 @@ -130,7 +130,7 @@ evtSource.close(); - `event` - : 事件的類型。如果有指定則在瀏覽器端會對該事件名稱的監聽器發布事件；網頁的原始碼必須使用 `addEventListener()` 來監聽已命名的事件。 `onmessage` 處理器只有在訊息沒有指定事件名稱時才會被呼叫。 - `data` - - : 訊息的資料欄位。當 EventSource 連續接收到多列以 `data:` 開頭的內容；[它會串接這些內容](http://www.w3.org/TR/eventsource/#dispatchMessage)並為每一列插入一個換行字元。最後的換行會被移除。 + - : 訊息的資料欄位。當 EventSource 連續接收到多列以 `data:` 開頭的內容；[它會串接這些內容](https://html.spec.whatwg.org/multipage/#dispatchMessage)並為每一列插入一個換行字元。最後的換行會被移除。 - `id` - : {{domxref("EventSource")}} 物件的最新一個事件 ID 。 - `retry` diff --git a/files/zh-tw/web/api/web_audio_api/index.md b/files/zh-tw/web/api/web_audio_api/index.md index 40aa00a46af7d9..62f4d43bdaad05 100644 --- a/files/zh-tw/web/api/web_audio_api/index.md +++ b/files/zh-tw/web/api/web_audio_api/index.md @@ -51,9 +51,9 @@ Web Audio API 亦可控制音訊的空間定位 (Spatialized) 作業：透過 so ## 線上教學 - 使用 Web Audio API -- [Getting Started with the Web Audio API](http://www.html5rocks.com/tutorials/webaudio/intro/) (僅說明 WebKit-only 的非標準建置) -- [混合定位音訊 (Positional Audio) 與 WebGL](http://www.html5rocks.com/tutorials/webaudio/positional_audio/) -- [以 Web Audio API 開發遊戲音訊](http://www.html5rocks.com/tutorials/webaudio/games/) +- [Getting Started with the Web Audio API](https://www.html5rocks.com/tutorials/webaudio/intro/) (僅說明 WebKit-only 的非標準建置) +- [混合定位音訊 (Positional Audio) 與 WebGL](https://www.html5rocks.com/tutorials/webaudio/positional_audio/) +- [以 Web Audio API 開發遊戲音訊](https://www.html5rocks.com/tutorials/webaudio/games/) - [將 webkitAudioContext 程式碼移植為標準的 AudioContext](/zh-TW/docs/Web_Audio_API/Porting_webkitAudioContext_code_to_standards_based_AudioContext) ## 規格 diff --git a/files/zh-tw/web/api/web_workers_api/using_web_workers/index.md b/files/zh-tw/web/api/web_workers_api/using_web_workers/index.md index 67fa76bd16e246..845183b5852962 100644 --- a/files/zh-tw/web/api/web_workers_api/using_web_workers/index.md +++ b/files/zh-tw/web/api/web_workers_api/using_web_workers/index.md @@ -27,7 +27,7 @@ dedicated worker 只能被產生它的檔案存取，下面我們先介紹簡單 ### 偵測 Worker 功能 -為了向下相容、避免錯誤，最好是確保 worker 存在後再取用之 ([main.js](https://github.com/mdn/simple-web-worker/blob/gh-pages/main.js)): +為了向下相容、避免錯誤，最好是確保 worker 存在後再取用之 ([main.js](https://github.com/mdn/simple-web-worker/blob/main/main.js)): ```js if (window.Worker) { @@ -39,7 +39,7 @@ if (window.Worker) { ### 產生 dedicated worker -只要呼叫 {{domxref("Worker.Worker", "Worker()")}} 建構子，傳入 JS 檔案的 URI，便可以生成一個 worker 執行緒 ([main.js](https://github.com/mdn/simple-web-worker/blob/gh-pages/main.js)): +只要呼叫 {{domxref("Worker.Worker", "Worker()")}} 建構子，傳入 JS 檔案的 URI，便可以生成一個 worker 執行緒 ([main.js](https://github.com/mdn/simple-web-worker/blob/main/main.js)): ```js hidden var myWorker = new Worker("worker.js"); @@ -47,7 +47,7 @@ var myWorker = new Worker("worker.js"); ### 和 dedicated worker 發送訊息 -{{domxref("Worker.postMessage", "postMessage()")}} 方法以及 {{domxref("Worker.onmessage", "onmessage")}} 事件處理器就是和 worker 發送訊息的關鍵 ([main.js](https://github.com/mdn/simple-web-worker/blob/gh-pages/main.js)): +{{domxref("Worker.postMessage", "postMessage()")}} 方法以及 {{domxref("Worker.onmessage", "onmessage")}} 事件處理器就是和 worker 發送訊息的關鍵 ([main.js](https://github.com/mdn/simple-web-worker/blob/main/main.js)): ```js first.onchange = function () { @@ -63,7 +63,7 @@ second.onchange = function () { 範例中有兩個 {{htmlelement("input")}} 元素，first 和 second，當元素值改變時，我們會利用 postMessage() 方法告訴 worker 改變的值 (這邊用陣列，也可以用其他類別)。 -然後在 worker 裡我們從 `onmessage` 接收訊息 ([worker.js](https://github.com/mdn/simple-web-worker/blob/gh-pages/worker.js)): +然後在 worker 裡我們從 `onmessage` 接收訊息 ([worker.js](https://github.com/mdn/simple-web-worker/blob/main/worker.js)): ```js onmessage = function (e) { @@ -148,11 +148,11 @@ shared worker 能夠被多個程式腳本存取，縱使跨越不同 window、if > **備註：** 所有的瀏覽環境都必需共享相同的來源（相同 protocol, host 和 port），shared worker 才能讓不同瀏覽環境存取。 -> **備註：** 在 Firefox，shared worker 無法在一般和隱私模式間共享（[Firefox bug 1177621](https://bugzil.la/1177621)）。 +> **備註：** 在 Firefox，shared worker 無法在一般和隱私模式間共享（[Firefox bug 1177621](https://bugzilla.mozilla.org/show_bug.cgi?id%3D1177621)）。 ### 產生 shared worker -和 dedicated worker 做法差不多，只是用另一個 SharedWorker 建構子來產生 shared worker，見 [index.html](https://github.com/mdn/simple-shared-worker/blob/gh-pages/index.html) 和 [index2.html](http://mdn.github.io/simple-shared-worker/index2.html): +和 dedicated worker 做法差不多，只是用另一個 SharedWorker 建構子來產生 shared worker，見 [index.html](https://github.com/mdn/simple-shared-worker/blob/main/index.html) 和 [index2.html](http://mdn.github.io/simple-shared-worker/index2.html): ```js var myWorker = new SharedWorker("worker.js"); @@ -160,7 +160,7 @@ var myWorker = new SharedWorker("worker.js"); 相當不 一樣的是和 shared worker 溝通必須要透過 port 物件，其實 dedicated worker 也是如此，只不過一切是在背景後自動完成。 -開啟 port 連線一是在 onmessage 事件下背景完成，二是藉由主動呼叫 start() 好開始傳送訊息。範例 [multiply.js](https://github.com/mdn/simple-shared-worker/blob/gh-pages/multiply.js) 以及 [worker.js](https://github.com/mdn/simple-shared-worker/blob/gh-pages/worker.js) 因為註冊了 onmessage 事件，所以其實可以省略呼叫 start()，然而若是 message 事件是經由 `addEventListener()註冊，那麼便需要呼叫 start() 了。` +開啟 port 連線一是在 onmessage 事件下背景完成，二是藉由主動呼叫 start() 好開始傳送訊息。範例 [multiply.js](https://github.com/mdn/simple-shared-worker/blob/main/multiply.js) 以及 [worker.js](https://github.com/mdn/simple-shared-worker/blob/main/worker.js) 因為註冊了 onmessage 事件，所以其實可以省略呼叫 start()，然而若是 message 事件是經由 `addEventListener()註冊，那麼便需要呼叫 start() 了。` 當使用 start() 開啟 port 連線，那麼雙向溝通便需要主執行緒和 worker 兩端都呼叫 start()。 @@ -174,7 +174,7 @@ port.start(); // called in worker thread, assuming the port variable references ### 和 shared worker 發送訊息 -如同前面，現在可以呼叫 `postMessage()` 發送訊息，只不過這次需要透過 port 物件 (一樣請參考 [multiply.js](https://github.com/mdn/simple-shared-worker/blob/gh-pages/multiply.js) 和 [square.js](https://github.com/mdn/simple-shared-worker/blob/gh-pages/square.js)): +如同前面，現在可以呼叫 `postMessage()` 發送訊息，只不過這次需要透過 port 物件 (一樣請參考 [multiply.js](https://github.com/mdn/simple-shared-worker/blob/main/multiply.js) 和 [square.js](https://github.com/mdn/simple-shared-worker/blob/main/square.js)): ```js squareNumber.onchange = function () { @@ -183,7 +183,7 @@ squareNumber.onchange = function () { }; ``` -worker 方面也增加了一些程式碼 ([worker.js](https://github.com/mdn/simple-shared-worker/blob/gh-pages/worker.js)): +worker 方面也增加了一些程式碼 ([worker.js](https://github.com/mdn/simple-shared-worker/blob/main/worker.js)): ```js onconnect = function (e) { @@ -202,7 +202,7 @@ onconnect = function (e) { 取得 port 之後，我們註冊 port 上的 onmessage 事件，當有訊息進來便取回資料進行運算後回傳回去；註冊 onmessage 事件的同時也自動建立連線，所以說不需要呼叫 start() 了。 -最後在主執行緒端，我們同樣由 onmessage 事件取回回傳過來的訊息 (一樣請參考 [multiply.js](https://github.com/mdn/simple-shared-worker/blob/gh-pages/multiply.js) 和 [square.js](https://github.com/mdn/simple-shared-worker/blob/gh-pages/square.js)): +最後在主執行緒端，我們同樣由 onmessage 事件取回回傳過來的訊息 (一樣請參考 [multiply.js](https://github.com/mdn/simple-shared-worker/blob/main/multiply.js) 和 [square.js](https://github.com/mdn/simple-shared-worker/blob/main/square.js)): ```js myWorker.port.onmessage = function (e) { diff --git a/files/zh-tw/web/api/webgl_api/tutorial/adding_2d_content_to_a_webgl_context/index.md b/files/zh-tw/web/api/webgl_api/tutorial/adding_2d_content_to_a_webgl_context/index.md index ab689785358668..398ecfa8924f86 100644 --- a/files/zh-tw/web/api/webgl_api/tutorial/adding_2d_content_to_a_webgl_context/index.md +++ b/files/zh-tw/web/api/webgl_api/tutorial/adding_2d_content_to_a_webgl_context/index.md @@ -266,12 +266,12 @@ function drawScene(gl, programInfo, buffers) { ## 矩陣運算 -矩陣的運算看起來很複雜，但其實[一步一步運算其實不會那麼困難](https://webglfundamentals.org/webgl/lessons/webgl-2d-matrices.html)。大部分使用者不會寫自己的運算函數，多半是使用現成的矩陣函數庫，這個例子中我們用的是 [glMatrix library](http://glmatrix.net/) 。 +矩陣的運算看起來很複雜，但其實[一步一步運算其實不會那麼困難](https://webglfundamentals.org/webgl/lessons/webgl-2d-matrices.html)。大部分使用者不會寫自己的運算函數，多半是使用現成的矩陣函數庫，這個例子中我們用的是 [glMatrix library](https://glmatrix.net/) 。 可參考以下資料 - [Matrices](https://webglfundamentals.org/webgl/lessons/webgl-2d-matrices.html) on WebGLFundamentals -- [Matrices](http://mathworld.wolfram.com/Matrix.html) on Wolfram MathWorld -- [Matrix]() on Wikipedia +- [Matrices](https://mathworld.wolfram.com/Matrix.html) on Wolfram MathWorld +- [Matrix]() on Wikipedia {{PreviousNext("Web/API/WebGL_API/Tutorial/Getting_started_with_WebGL", "Web/API/WebGL_API/Tutorial/Using_shaders_to_apply_color_in_WebGL")}} diff --git a/files/zh-tw/web/api/webgl_api/tutorial/getting_started_with_webgl/index.md b/files/zh-tw/web/api/webgl_api/tutorial/getting_started_with_webgl/index.md index 4c727ec7f17e76..4412983dbcd943 100644 --- a/files/zh-tw/web/api/webgl_api/tutorial/getting_started_with_webgl/index.md +++ b/files/zh-tw/web/api/webgl_api/tutorial/getting_started_with_webgl/index.md @@ -5,7 +5,7 @@ slug: Web/API/WebGL_API/Tutorial/Getting_started_with_WebGL {{DefaultAPISidebar("WebGL")}} {{Next("Web/API/WebGL_API/Tutorial/Adding_2D_content_to_a_WebGL_context")}} -[WebGL](http://www.khronos.org/webgl/) 讓網頁內容能藉由一種基於 [OpenGL ES](http://www.khronos.org/opengles/) 2.0 的 API 的幫助，於支援此 API 的瀏覽器環境中，不需使用外掛程式就能在 HTML 的 [`canvas`](/zh-TW/docs/Web/API/Canvas_API) 元素中實現二維及三維渲染。 WebGL 程式包含了由 JavaSrcipt 及著色器(GLSL)撰寫的控制碼以及在電腦的圖形處理器( GPU )上執行的特效程式碼(著色器程式碼)。WebGL 元素可以加入其他 HTML 元素之中並與網頁或網頁背景的其他部分混合。 +[WebGL](https://www.khronos.org/webgl/) 讓網頁內容能藉由一種基於 [OpenGL ES](https://www.khronos.org/opengles/) 2.0 的 API 的幫助，於支援此 API 的瀏覽器環境中，不需使用外掛程式就能在 HTML 的 [`canvas`](/zh-TW/docs/Web/API/Canvas_API) 元素中實現二維及三維渲染。 WebGL 程式包含了由 JavaSrcipt 及著色器(GLSL)撰寫的控制碼以及在電腦的圖形處理器( GPU )上執行的特效程式碼(著色器程式碼)。WebGL 元素可以加入其他 HTML 元素之中並與網頁或網頁背景的其他部分混合。 這篇文章將會向你介紹 WebGL 的基礎。這篇文章假設你已經對於三維圖學涉及的數學有所了解，並且它將不會被佯裝為三維圖學的教材。在我們的學習區域內有初學者指南讓你完成編程任務：[Learn WebGL for 2D and 3D graphics](/zh-TW/docs/Learn/WebGL). @@ -63,8 +63,8 @@ function main() { ## 亦可參考 -- [An introduction to WebGL](https://dev.opera.com/articles/introduction-to-webgl-part-1/): 由 Luz Caballero 撰寫，並出版在 dev.opera.com。 這篇文章點出了 WebGL 的意義，解釋了其運作(包含渲染管路的觀念)，並介紹了一些 WebGL libraries。 -- [WebGL Fundamentals](http://webglfundamentals.org/) -- [An intro to modern OpenGL:](http://duriansoftware.com/joe/An-intro-to-modern-OpenGL.-Table-of-Contents.html) 由 Joe Groff 撰寫的一系列關於 OpenGL 的好文章，提供了 OpenGL 清楚的簡介，從其歷史到重要的圖像管路概念，以及一些展示其原理的範例。如果你完全不懂 OpenGL，這將是一個好的入門介紹。 +- [An introduction to WebGL](https://blogs.opera.com/news/): 由 Luz Caballero 撰寫，並出版在 dev.opera.com。 這篇文章點出了 WebGL 的意義，解釋了其運作(包含渲染管路的觀念)，並介紹了一些 WebGL libraries。 +- [WebGL Fundamentals](https://webglfundamentals.org/) +- [An intro to modern OpenGL:](https://duriansoftware.com/joe/an-intro-to-modern-opengl.-table-of-contents) 由 Joe Groff 撰寫的一系列關於 OpenGL 的好文章，提供了 OpenGL 清楚的簡介，從其歷史到重要的圖像管路概念，以及一些展示其原理的範例。如果你完全不懂 OpenGL，這將是一個好的入門介紹。 {{Next("Web/API/WebGL_API/Tutorial/Adding_2D_content_to_a_WebGL_context")}} diff --git a/files/zh-tw/web/api/webgl_api/tutorial/index.md b/files/zh-tw/web/api/webgl_api/tutorial/index.md index 70f703fdbc99b8..0d2217bb9af93e 100644 --- a/files/zh-tw/web/api/webgl_api/tutorial/index.md +++ b/files/zh-tw/web/api/webgl_api/tutorial/index.md @@ -5,7 +5,7 @@ slug: Web/API/WebGL_API/Tutorial {{DefaultAPISidebar("WebGL")}} -[WebGL](http://www.khronos.org/webgl/) 讓網頁內容可以使用一個基於 [OpenGL ES](http://www.khronos.org/opengles/) 2.0 的 API 以在 HTML {{HTMLElement("canvas")}}中執行 3D 渲染，且瀏覽器無需使用任何 plug-in。WebGL programs 由 JavaScript 撰寫的指令碼以及透過電腦的 Graphics Processing Unit (GPU)上運行的特殊效果程式碼(shader code)組成。WebGL 元件可與其他 HTML 元件混合，並與該頁的其他部分或該頁背景組合使用。 +[WebGL](https://www.khronos.org/webgl/) 讓網頁內容可以使用一個基於 [OpenGL ES](https://www.khronos.org/opengles/) 2.0 的 API 以在 HTML {{HTMLElement("canvas")}}中執行 3D 渲染，且瀏覽器無需使用任何 plug-in。WebGL programs 由 JavaScript 撰寫的指令碼以及透過電腦的 Graphics Processing Unit (GPU)上運行的特殊效果程式碼(shader code)組成。WebGL 元件可與其他 HTML 元件混合，並與該頁的其他部分或該頁背景組合使用。 本教學描述如何使用 `` 元件描繪 WebGL 圖像/圖形, 從基礎開始。提供的範例將讓你對於可以用 WebGL 做到什麼有清楚的概念，並提供程式碼片段讓你可以著手建立自己的內容。 diff --git a/files/zh-tw/web/api/websocket/index.md b/files/zh-tw/web/api/websocket/index.md index 9f471d61641882..cc265144416f87 100644 --- a/files/zh-tw/web/api/websocket/index.md +++ b/files/zh-tw/web/api/websocket/index.md @@ -105,7 +105,7 @@ void send( ## 參見 - [製作 WebSocket 客戶端應用程式](/zh_tw/WebSockets/Writing_WebSocket_client_applications) -- [HTML5: WebSockets](http://dev.w3.org/html5/websockets/) +- [HTML5: WebSockets](https://websockets.spec.whatwg.org/) ## 瀏覽器兼容 diff --git a/files/zh-tw/web/api/websockets_api/index.md b/files/zh-tw/web/api/websockets_api/index.md index 9bec44f0f5b104..200de2a375bcfd 100644 --- a/files/zh-tw/web/api/websockets_api/index.md +++ b/files/zh-tw/web/api/websockets_api/index.md @@ -71,7 +71,7 @@ WebSocket 是一種讓瀏覽器與伺服器進行一段互動通訊的技術。 ## 參見 -- [WebSocket API Specification](http://dev.w3.org/html5/websockets/) +- [WebSocket API Specification](https://websockets.spec.whatwg.org/) - [Server-Sent Events](/zh-TW/Server-sent_events) ## 瀏覽器兼容 diff --git a/files/zh-tw/web/api/websockets_api/writing_websocket_client_applications/index.md b/files/zh-tw/web/api/websockets_api/writing_websocket_client_applications/index.md index 08f9a3836587b9..c1b0f21b63cc6c 100644 --- a/files/zh-tw/web/api/websockets_api/writing_websocket_client_applications/index.md +++ b/files/zh-tw/web/api/websockets_api/writing_websocket_client_applications/index.md @@ -175,4 +175,4 @@ mySocket.close(); ## 參考資料 -[IETF: The WebSocket protocol draft-abarth-thewebsocketprotocol-01](https://tools.ietf.org/html/draft-abarth-thewebsocketprotocol-01) +[IETF: The WebSocket protocol draft-abarth-thewebsocketprotocol-01](https://datatracker.ietf.org/doc/html/draft-abarth-thewebsocketprotocol-01) diff --git a/files/zh-tw/web/api/webvtt_api/index.md b/files/zh-tw/web/api/webvtt_api/index.md index bb68dc21bbd752..cf568c06348b6e 100644 --- a/files/zh-tw/web/api/webvtt_api/index.md +++ b/files/zh-tw/web/api/webvtt_api/index.md @@ -544,7 +544,7 @@ That's <00:00:21.000>amore ``` - **Ruby tag** (``) - - : Used with ruby text tags to display [ruby characters](http://en.wikipedia.org/wiki/Ruby_character) (i.e. small annotative characters above other characters). + - : Used with ruby text tags to display [ruby characters](https://en.wikipedia.org/wiki/Ruby_character) (i.e. small annotative characters above other characters). ##### Example 18 - Ruby tag @@ -553,7 +553,7 @@ That's <00:00:21.000>amore ``` - **Ruby text tag** (``) - - : Used with ruby tags to display [ruby characters](http://en.wikipedia.org/wiki/Ruby_character) (i.e. small annotative characters above other characters). + - : Used with ruby tags to display [ruby characters](https://en.wikipedia.org/wiki/Ruby_character) (i.e. small annotative characters above other characters). ##### Example 19 - Ruby text tag diff --git a/files/zh-tw/web/api/window/popstate_event/index.md b/files/zh-tw/web/api/window/popstate_event/index.md index fb476d12287e1c..6901d6b7b0eff3 100644 --- a/files/zh-tw/web/api/window/popstate_event/index.md +++ b/files/zh-tw/web/api/window/popstate_event/index.md @@ -49,7 +49,7 @@ history.go(2); // 跳出 "location: http://example.com/example.html?page=3, stat ## 標準 -- [HTML5 popstate event](http://www.whatwg.org/specs/web-apps/current-work/#handler-window-onpopstate) +- [HTML5 popstate event](https://html.spec.whatwg.org/#handler-window-onpopstate) ## 請參照 diff --git a/files/zh-tw/web/api/window/requestanimationframe/index.md b/files/zh-tw/web/api/window/requestanimationframe/index.md index ede4c1e0f5bfb6..4c523733765e48 100644 --- a/files/zh-tw/web/api/window/requestanimationframe/index.md +++ b/files/zh-tw/web/api/window/requestanimationframe/index.md @@ -64,8 +64,8 @@ Edge 低於 17 的版本和 Internet Explorer 無法保證在繪製循環前觸 - {{domxref("Window.mozAnimationStartTime")}} - {{domxref("Window.cancelAnimationFrame()")}} - [mozRequestAnimationFrame](https://robert.ocallahan.org/2010/08/mozrequestanimationframe-frame-rate_17.html) - Blog post -- [requestAnimationFrame for smart animating](http://paulirish.com/2011/requestanimationframe-for-smart-animating/) - Blog post +- [requestAnimationFrame for smart animating](https://www.paulirish.com/2011/requestanimationframe-for-smart-animating/) - Blog post - [Animating with javascript: from setInterval to requestAnimationFrame](http://hacks.mozilla.org/2011/08/animating-with-javascript-from-setinterval-to-requestanimationframe/) - Blog post -- [Using PC Hardware more efficiently in HTML5: New Web Performance APIs, Part 1](http://blogs.msdn.com/b/ie/archive/2011/07/05/using-pc-hardware-more-efficiently-in-html5-new-web-performance-apis-part-1.aspx) - Blog post -- [TestUFO: Test your web browser for requestAnimationFrame() Timing Deviations](http://www.testufo.com/#test=animation-time-graph) +- [Using PC Hardware more efficiently in HTML5: New Web Performance APIs, Part 1](https://devblogs.microsoft.com/ie/using-pc-hardware-more-efficiently-in-html5-new-web-performance-apis-part-1.aspx) - Blog post +- [TestUFO: Test your web browser for requestAnimationFrame() Timing Deviations](https://www.testufo.com/#test%3Danimation-time-graph) - Paul Irish: [requestAnimationFrame API: now with sub-millisecond precision](http://updates.html5rocks.com/2012/05/requestAnimationFrame-API-now-with-sub-millisecond-precision) diff --git a/files/zh-tw/web/api/xmlhttprequest/xmlhttprequest/index.md b/files/zh-tw/web/api/xmlhttprequest/xmlhttprequest/index.md index e19f37b3665f1c..6cb56fa8e717ef 100644 --- a/files/zh-tw/web/api/xmlhttprequest/xmlhttprequest/index.md +++ b/files/zh-tw/web/api/xmlhttprequest/xmlhttprequest/index.md @@ -25,7 +25,7 @@ const request = new XMLHttpRequest(); ## 非標準的 Firefox 語法 -Firefox 16 added a non-standard parameter to the constructor that can enable anonymous mode (see [Firefox bug 692677](https://bugzil.la/692677)). Setting the `mozAnon` flag to `true` effectively resembles the [`AnonXMLHttpRequest()`](http://www.w3.org/TR/2012/WD-XMLHttpRequest-20120117/#dom-anonxmlhttprequest) constructor described in older versions of the XMLHttpRequest specification. +Firefox 16 added a non-standard parameter to the constructor that can enable anonymous mode (see [Firefox bug 692677](https://bugzilla.mozilla.org/show_bug.cgi?id%3D692677)). Setting the `mozAnon` flag to `true` effectively resembles the [`AnonXMLHttpRequest()`](https://www.w3.org/TR/2012/WD-XMLHttpRequest-20120117/#dom-anonxmlhttprequest) constructor described in older versions of the XMLHttpRequest specification. ```js const request = new XMLHttpRequest(paramsDictionary); @@ -38,9 +38,9 @@ const request = new XMLHttpRequest(paramsDictionary); - : There are two flags you can set: - `mozAnon` - - : Boolean: Setting this flag to `true` will cause the browser not to expose the {{Glossary("origin")}} and [user credentials](http://www.w3.org/TR/2012/WD-XMLHttpRequest-20120117/#user-credentials) when fetching resources. Most important, this means that {{Glossary("Cookie", "cookies")}} will not be sent unless explicitly added using setRequestHeader. + - : Boolean: Setting this flag to `true` will cause the browser not to expose the {{Glossary("origin")}} and [user credentials](https://www.w3.org/TR/2012/WD-XMLHttpRequest-20120117/#user-credentials) when fetching resources. Most important, this means that {{Glossary("Cookie", "cookies")}} will not be sent unless explicitly added using setRequestHeader. - `mozSystem` - - : Boolean: Setting this flag to `true` allows making cross-site connections without requiring the server to opt-in using {{Glossary("CORS")}}. _Requires setting `mozAnon: true`, i.e. this can't be combined with sending cookies or other user credentials. This only works in privileged (reviewed) apps ([Firefox bug 692677](https://bugzil.la/692677)); it does not work on arbitrary webpages loaded in Firefox_ + - : Boolean: Setting this flag to `true` allows making cross-site connections without requiring the server to opt-in using {{Glossary("CORS")}}. _Requires setting `mozAnon: true`, i.e. this can't be combined with sending cookies or other user credentials. This only works in privileged (reviewed) apps ([Firefox bug 692677](https://bugzilla.mozilla.org/show_bug.cgi?id%3D692677)); it does not work on arbitrary webpages loaded in Firefox_ ## 參見 diff --git a/files/zh-tw/web/api/xmlhttprequest_api/using_xmlhttprequest/index.md b/files/zh-tw/web/api/xmlhttprequest_api/using_xmlhttprequest/index.md index 1c9d563e6dc0c3..b12b1d8f7c4ca0 100644 --- a/files/zh-tw/web/api/xmlhttprequest_api/using_xmlhttprequest/index.md +++ b/files/zh-tw/web/api/xmlhttprequest_api/using_xmlhttprequest/index.md @@ -39,7 +39,7 @@ oReq.send(); ### 分析及操作含有 HTML 文件的 `responseText` 屬性 -> **備註：** W3C 的[XMLHttpRequest](https://dvcs.w3.org/hg/xhr/raw-file/tip/Overview.html) 規範允許透過 `XMLHttpRequest.responseXML` 屬性（{{Glossary("property/JavaScript", "property")}}）來解析 HTML。相關細節請參考 [HTML in XMLHttpRequest](/docs/Web/API/XMLHttpRequest_API/HTML_in_XMLHttpRequest) 一文。 +> **備註：** W3C 的[XMLHttpRequest](https://xhr.spec.whatwg.org/) 規範允許透過 `XMLHttpRequest.responseXML` 屬性（{{Glossary("property/JavaScript", "property")}}）來解析 HTML。相關細節請參考 [HTML in XMLHttpRequest](/docs/Web/API/XMLHttpRequest_API/HTML_in_XMLHttpRequest) 一文。 若透過 `XMLHttpRequest` 來取得一個遠端的 HTML 網頁內容，則 `responseText` 屬性（{{Glossary("property/JavaScript", "property")}}）會是「一串（soup）」包含所有 HTML 標籤的字串。這可能使得在分析和操作上造成困難，以下有三種主要分析此一大串 HTML 字串的方式： diff --git a/files/zh-tw/web/css/@font-face/index.md b/files/zh-tw/web/css/@font-face/index.md index b1a97cfd006594..a5056b14b022e3 100644 --- a/files/zh-tw/web/css/@font-face/index.md +++ b/files/zh-tw/web/css/@font-face/index.md @@ -105,7 +105,7 @@ You can specify a font on the user's local computer by name using the `local()` - [About WOFF](/zh-TW/docs/WOFF) - [FontSquirrel @font-face generator](https://www.fontsquirrel.com/fontface/generator) - [Beautiful fonts with @font-face](https://hacks.mozilla.org/2009/06/beautiful-fonts-with-font-face/) -- [Open Font Library](https://openfontlibrary.org/) -- [Microsoft Developer Network (MSDN) @font-face reference]() -- [When can I use WOFF?](http://caniuse.com/woff) -- [When can I use SVG Fonts?](http://caniuse.com/svg-fonts) +- [Open Font Library](https://fontlibrary.org/) +- [Microsoft Developer Network (MSDN) @font-face reference]().aspx>) +- [When can I use WOFF?](https://caniuse.com/woff) +- [When can I use SVG Fonts?](https://caniuse.com/svg-fonts) diff --git a/files/zh-tw/web/css/_colon_lang/index.md b/files/zh-tw/web/css/_colon_lang/index.md index 99230ecbdda3b7..32f9d1006f9274 100644 --- a/files/zh-tw/web/css/_colon_lang/index.md +++ b/files/zh-tw/web/css/_colon_lang/index.md @@ -72,4 +72,4 @@ slug: Web/CSS/:lang - 語言相關偽類： {{cssxref(":lang")}}, {{cssxref(":dir")}} - HTML [`lang`](/zh-TW/docs/Web/HTML/Global_attributes#lang) 屬性 -- [BCP 47 - Tags for Identifying Languages (BCP 47 - 識別語言的標籤)](https://tools.ietf.org/html/bcp47) +- [BCP 47 - Tags for Identifying Languages (BCP 47 - 識別語言的標籤)](https://www.rfc-editor.org/info/bcp47) diff --git a/files/zh-tw/web/css/box-shadow/index.md b/files/zh-tw/web/css/box-shadow/index.md index 1b25dcf206def4..56b572a2b20a39 100644 --- a/files/zh-tw/web/css/box-shadow/index.md +++ b/files/zh-tw/web/css/box-shadow/index.md @@ -54,8 +54,8 @@ box-shadow: ## 範例 - [CSS box-shadow examples](https://techmoon.xyz/css-box-shadow-examples-by-css-scan/) -- [box-shadow test](http://www.elektronotdienst-nuernberg.de/bugs/box-shadow_inset.html) -- [box-shadow tutorial and examples](http://markusstange.wordpress.com/2009/02/15/fun-with-box-shadows/) +- [box-shadow test](http://elektronotdienst-nuernberg.de/bugs/box-shadow_inset.html) +- [box-shadow tutorial and examples](https://markusstange.wordpress.com/2009/02/15/fun-with-box-shadows/) ```plain box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px; diff --git a/files/zh-tw/web/css/css_flexible_box_layout/basic_concepts_of_flexbox/index.md b/files/zh-tw/web/css/css_flexible_box_layout/basic_concepts_of_flexbox/index.md index e449d36556e4ca..4cbb8fe4d86ea0 100644 --- a/files/zh-tw/web/css/css_flexible_box_layout/basic_concepts_of_flexbox/index.md +++ b/files/zh-tw/web/css/css_flexible_box_layout/basic_concepts_of_flexbox/index.md @@ -11,7 +11,7 @@ CSS3 **彈性盒子**，又稱**flexbox**，是為了適應不同螢幕尺寸和 一些時髦的佈局，也能因而透過更簡潔的程式碼完成。這種有意的獨立性只影響視覺渲染，基於 HTML 原始碼的語意順序及瀏覽不會受到影響。 -> **備註：** 儘管 [CSS 彈性盒子佈局規範](http://www.w3.org/TR/css3-flexbox/)還處於最終徵求意見稿（Last Call Working Draft）階段（參見[最新編輯草案](http://dev.w3.org/csswg/css-flexbox/)）、也不是所有瀏覽器都實做彈性盒子的所有功能。但這麼說好了，現在主流的瀏覽器，都對 flexbox 有著良好的支持。請參見[相容性表格](/zh-TW/docs/Web/Guide/CSS/Flexible_boxes#Browser_compatibility)的具體屬性，以獲取最新的相容狀態。 +> **備註：** 儘管 [CSS 彈性盒子佈局規範](https://www.w3.org/TR/css-flexbox-1/)還處於最終徵求意見稿（Last Call Working Draft）階段（參見[最新編輯草案](https://drafts.csswg.org/css-flexbox/)）、也不是所有瀏覽器都實做彈性盒子的所有功能。但這麼說好了，現在主流的瀏覽器，都對 flexbox 有著良好的支持。請參見[相容性表格](/zh-TW/docs/Web/Guide/CSS/Flexible_boxes#Browser_compatibility)的具體屬性，以獲取最新的相容狀態。 ## 彈性盒子的概念 @@ -250,7 +250,7 @@ Recall that while the display order of the elements is independent of their orde 以下提供一些與彈性盒子相關的網站讓你親手操作： -- [Flexbox Playground](http://demo.agektmr.com/flexbox/) +- [Flexbox Playground](https://demo.agektmr.com/flexbox/) - [Flexy Boxes](http://the-echoplex.net/flexyboxes) - [Flexbox Properties Demonstration](https://codepen.io/justd/pen/yydezN) - [Flexbox Froggy](http://flexboxfroggy.com/) diff --git a/files/zh-tw/web/css/css_grid_layout/index.md b/files/zh-tw/web/css/css_grid_layout/index.md index 1b9d1d39430299..6da8dbc4e2dec5 100644 --- a/files/zh-tw/web/css/css_grid_layout/index.md +++ b/files/zh-tw/web/css/css_grid_layout/index.md @@ -143,8 +143,8 @@ slug: Web/CSS/CSS_grid_layout ## 外部資源 -- [Jen Simmons 的示範](http://labs.jensimmons.com/) -- [格線示例：一些影片教學與使用範例](http://gridbyexample.com/) +- [Jen Simmons 的示範](https://labs.jensimmons.com/) +- [格線示例：一些影片教學與使用範例](https://gridbyexample.com/) - [Codrops 格線參考](https://tympanus.net/codrops/css_reference/grid/) - [Firefox DevTools CSS Grid Inspector](/zh-TW/docs/Tools/Page_Inspector/How_to/Examine_grid_layouts) - [CSS Grid Playground](https://mozilladevelopers.github.io/playground/) diff --git a/files/zh-tw/web/css/css_transitions/using_css_transitions/index.md b/files/zh-tw/web/css/css_transitions/using_css_transitions/index.md index ef0eedffcdf4eb..22e729c78e6333 100644 --- a/files/zh-tw/web/css/css_transitions/using_css_transitions/index.md +++ b/files/zh-tw/web/css/css_transitions/using_css_transitions/index.md @@ -38,7 +38,7 @@ CSS transitions 和 CSS animations 中可以用來修改的屬性在 [CSS animat 漸變函式可用來定義轉場發生的時間曲線。其規範方式是以四個參數的貝茲曲線代表。 -[CSS transition function manipulator](http://cssglue.com/cubic) 是一個可以讓你非常容易以視覺化方式了解轉場流程的工具。 +[CSS transition function manipulator](https://www.themagazine.org/) 是一個可以讓你非常容易以視覺化方式了解轉場流程的工具。 除了自行定義之外，尚有幾個已經預先定義好的函式： @@ -390,8 +390,8 @@ function updateTransition() { ## 更多資訊 -- [CSS Transitions](http://dev.w3.org/csswg/css3-transitions/) -- [CSS Transitions Module Level 3](http://www.w3.org/TR/css3-transitions) +- [CSS Transitions](https://drafts.csswg.org/css-transitions-1/) +- [CSS Transitions Module Level 3](https://www.w3.org/TR/css-transitions-1/) - [CSS animatable properties](http://oli.jp/2010/css-animatable-properties/) - {{ cssxref("-moz-transition") }} - {{ cssxref("-moz-transition-property") }} diff --git a/files/zh-tw/web/css/grid-template/index.md b/files/zh-tw/web/css/grid-template/index.md index d7e0bc344c66a2..5fe99db8f0eb17 100644 --- a/files/zh-tw/web/css/grid-template/index.md +++ b/files/zh-tw/web/css/grid-template/index.md @@ -124,4 +124,4 @@ footer { - Related CSS properties: {{cssxref("grid-template-rows")}}, {{cssxref("grid-template-columns")}}, {{cssxref("grid-template-areas")}} - Grid Layout Guide: _[Line-based placement with CSS Grid](/zh-TW/docs/Web/CSS/CSS_grid_layout/Grid_layout_using_line-based_placement)_ - Grid Layout Guide: _[Grid template areas - Grid definition shorthands](/zh-TW/docs/Web/CSS/CSS_grid_layout/Grid_template_areas#Grid_definition_shorthands)_ -- Video tutorial:_ [Grid Template shorthand](http://gridbyexample.com/video/grid-template-shorthand/)_ +- Video tutorial:_ [Grid Template shorthand](https://gridbyexample.com/video/grid-template-shorthand/)_ diff --git a/files/zh-tw/web/css/index.md b/files/zh-tw/web/css/index.md index 2ce7f06ba4d38d..972dbd93e8162c 100644 --- a/files/zh-tw/web/css/index.md +++ b/files/zh-tw/web/css/index.md @@ -7,7 +7,7 @@ slug: Web/CSS **層疊樣式表**（Cascading Style Sheets, CSS）是用來描述 [HTML](/zh-TW/docs/Web/HTML) 或 [XML](/zh-TW/docs/XML)（包含 [SVG](/zh-TW/docs/Web/SVG) 或 [XHTML](/zh-TW/docs/Glossary/XHTML) 等各種 XML 變形）文件外觀的[樣式表](/zh-TW/docs/DOM/stylesheet)語言。CSS 會描述文件裡的結構化元素，該如何呈現在螢幕、紙、語音報讀、或其他媒介上。 -**CSS** 是**開放網路**的核心語言之一，具有標準化的 [W3C 規範](https://w3.org/Style/CSS/#specs)。歷經不同層級的開發，CSS1 目前已被棄用、CSS2.1 是建議規範，而 CSS3 目前被分作數個較小的模組，持續在標準化的路上行進。 +**CSS** 是**開放網路**的核心語言之一，具有標準化的 [W3C 規範](https://www.w3.org/Style/CSS/#specs)。歷經不同層級的開發，CSS1 目前已被棄用、CSS2.1 是建議規範，而 CSS3 目前被分作數個較小的模組，持續在標準化的路上行進。 - CSS 介紹 @@ -51,15 +51,15 @@ slug: Web/CSS ## CSS 開發工具 -- The [W3C CSS 驗證服務](http://jigsaw.w3.org/css-validator/) 能檢查 CSS 的有效性。[OnlineWebCheck.com](http://www.onlinewebcheck.com/) 也在做相同的事情。它們都是很重要的除錯工具。 +- The [W3C CSS 驗證服務](https://jigsaw.w3.org/css-validator/) 能檢查 CSS 的有效性。[OnlineWebCheck.com](https://www.onlinewebcheck.com/) 也在做相同的事情。它們都是很重要的除錯工具。 - [Firefox 開發者工具](https://firefox-source-docs.mozilla.org/devtools-user/index.html)能透過[頁面檢測器](https://firefox-source-docs.mozilla.org/devtools-user/page_inspector/index.html)與[樣式編輯器](https://firefox-source-docs.mozilla.org/devtools-user/style_editor/index.html)直接觀察、編輯網頁的 CSS。 -- Firefox 的[Firebug 套件](https://addons.mozilla.org/zh-TW/firefox/addon/1843)，navigator 裡面，能直接觀察、編輯網頁的 CSS 的人氣套件。要測試某些變化的時候會非常實用，而這套件還能做得更多。 -- Firefox 的[Web Developer 套件](https://addons.mozilla.org/zh-TW/firefox/addon/60) 也能能直接觀察、編輯網頁的 CSS。與 Firebug 相比更簡單、但相比下也沒那麼強大。 +- Firefox 的[Firebug 套件](https://addons.mozilla.org/zh-TW/firefox/addon/1843/)，navigator 裡面，能直接觀察、編輯網頁的 CSS 的人氣套件。要測試某些變化的時候會非常實用，而這套件還能做得更多。 +- Firefox 的[Web Developer 套件](https://addons.mozilla.org/zh-TW/firefox/addon/web-developer/) 也能能直接觀察、編輯網頁的 CSS。與 Firebug 相比更簡單、但相比下也沒那麼強大。 - [其他 CSS 工具。](/zh-TW/docs/Web/CSS/Tools) ## Meta 錯誤 -- Firefox: [Firefox bug 1323667](https://bugzil.la/1323667) +- Firefox: [Firefox bug 1323667](https://bugzilla.mozilla.org/show_bug.cgi?id%3D1323667) ## 參見 diff --git a/files/zh-tw/web/events/creating_and_triggering_events/index.md b/files/zh-tw/web/events/creating_and_triggering_events/index.md index 0691eac6ff95b5..d622e2ca59cae2 100644 --- a/files/zh-tw/web/events/creating_and_triggering_events/index.md +++ b/files/zh-tw/web/events/creating_and_triggering_events/index.md @@ -65,7 +65,7 @@ elem.dispatchEvent(event); ## 觸發自定義事件 -下面的例子演示了一個複選框藉由 DOM 的 methods 模擬一次點擊（換言之，讓程式執行一次「點擊事件」。）。 [觀看實例](http://developer.mozilla.org/samples/domref/dispatchEvent.html)。 +下面的例子演示了一個複選框藉由 DOM 的 methods 模擬一次點擊（換言之，讓程式執行一次「點擊事件」。）。 [觀看實例](https://mdn.dev/archives/media/samples/domref/dispatchEvent.html)。 ```js function simulateClick() { diff --git a/files/zh-tw/web/html/attributes/index.md b/files/zh-tw/web/html/attributes/index.md index 1cf1c086e4c253..7e63afe7feef85 100644 --- a/files/zh-tw/web/html/attributes/index.md +++ b/files/zh-tw/web/html/attributes/index.md @@ -135,7 +135,7 @@ IDL 屬性也被稱為 JavaScript 特性。你可以使用 JavaScript 特性的 IDL 屬性並非永遠的字串 ; 舉例來說，input.maxlength 便是一個數字(型態為 signed long)。當使用 IDL 屬性，你會閱讀或是設定所需的型態，而當你設定 input.maxlength 時，它總是回傳一個數字，因為它正需要一個數字。如果你傳入別的型態，它會依照標準 JavaScript 型態轉換規則，將傳入值轉成一個數字。 -IDL 屬性可以 [反應其他型態](http://www.whatwg.org/specs/web-apps/current-work/multipage/urls.html#reflecting-content-attributes-in-idl-attributes)，例如 unsigned long、URLs、booleans，等等。不幸的是，並沒有明確的規則來規範，而且與 IDL 屬性行為相對應的內容屬性連結中，也沒有取決於該屬性的方式。在大部分的時間裡，它會遵守 [規範中所制定的規則](http://www.whatwg.org/specs/web-apps/current-work/multipage/urls.html#reflecting-content-attributes-in-idl-attributes)，但有時候它並不會。HTML 規範嘗試讓它變得容易使用，但由於各種原因 (大多是因為歷史)，有些屬性表現得很奇怪 (舉例來說，select.size)，而你應該詳細閱讀規範以了解各個屬性的行為。 +IDL 屬性可以 [反應其他型態](https://html.spec.whatwg.org/multipage/urls-and-fetching.html#reflecting-content-attributes-in-idl-attributes)，例如 unsigned long、URLs、booleans，等等。不幸的是，並沒有明確的規則來規範，而且與 IDL 屬性行為相對應的內容屬性連結中，也沒有取決於該屬性的方式。在大部分的時間裡，它會遵守 [規範中所制定的規則](https://html.spec.whatwg.org/multipage/urls-and-fetching.html#reflecting-content-attributes-in-idl-attributes)，但有時候它並不會。HTML 規範嘗試讓它變得容易使用，但由於各種原因 (大多是因為歷史)，有些屬性表現得很奇怪 (舉例來說，select.size)，而你應該詳細閱讀規範以了解各個屬性的行為。 ## 另請參見 diff --git a/files/zh-tw/web/html/element/button/index.md b/files/zh-tw/web/html/element/button/index.md index af3344cfefd496..4f8bb2c8d777f8 100644 --- a/files/zh-tw/web/html/element/button/index.md +++ b/files/zh-tw/web/html/element/button/index.md @@ -177,7 +177,7 @@ Firefox 會在焦點位於按鈕上時添加一個小虛點邊框。這個邊框 ### 點擊和焦點 -在大多數瀏覽器中，單擊 {{HTMLElement("button")}} 或 {{HTMLElement("input")}} 按鈕類型會導致其（默認情況下）獲得焦點，但是根據瀏覽器和操作系統，這是不同的。大多數瀏覽器確實會將焦點設置在單擊的按鈕上，但是 [Safari 由於設計原因不會這樣做](https://webkit.org/b/22261)。 +在大多數瀏覽器中，單擊 {{HTMLElement("button")}} 或 {{HTMLElement("input")}} 按鈕類型會導致其（默認情況下）獲得焦點，但是根據瀏覽器和操作系統，這是不同的。大多數瀏覽器確實會將焦點設置在單擊的按鈕上，但是 [Safari 由於設計原因不會這樣做](https://bugs.webkit.org/show_bug.cgi?id%3D22261)。 ## 技術摘要 diff --git a/files/zh-tw/web/html/element/fencedframe/index.md b/files/zh-tw/web/html/element/fencedframe/index.md index d89da736675251..12a194cd297c3c 100644 --- a/files/zh-tw/web/html/element/fencedframe/index.md +++ b/files/zh-tw/web/html/element/fencedframe/index.md @@ -37,7 +37,7 @@ l10n: 可以通過策略在圍欄頁框內啟用的唯一功能是專為在圍欄頁框內使用而設計的特定功能： -- [受保護的受眾 API](https://developer.chrome.com/docs/privacy-sandbox/fledge/) +- [受保護的受眾 API](https://developers.google.com/privacy-sandbox/relevance/protected-audience) - `attribution-reporting` - `private-aggregation` - `shared-storage` @@ -64,7 +64,7 @@ l10n: ## 範例 -要設置 `` 中顯示的內容，需要使用 API（例如[受保護的受眾](https://developer.chrome.com/docs/privacy-sandbox/fledge/)或[共享存儲](https://developer.chrome.com/docs/privacy-sandbox/shared-storage/)）生成一個 {{domxref("FencedFrameConfig")}} 對象，然後將其設置為 `` 的 `config` 屬性的值。 +要設置 `` 中顯示的內容，需要使用 API（例如[受保護的受眾](https://developers.google.com/privacy-sandbox/relevance/protected-audience)或[共享存儲](https://developers.google.com/privacy-sandbox/relevance/shared-storage)）生成一個 {{domxref("FencedFrameConfig")}} 對象，然後將其設置為 `` 的 `config` 屬性的值。 以下範例從受保護的受眾 API 的廣告拍賣中獲取了一個 `FencedFrameConfig`，然後將其用於在 `` 中顯示獲勝的廣告： @@ -168,5 +168,5 @@ frame.config = frameConfig; ## 參見 - [圍欄頁框 API](/zh-TW/docs/Web/API/Fenced_frame_API) -- [在 developer.chrome.com 上的圍欄頁框](https://developer.chrome.com/docs/privacy-sandbox/fenced-frame/) -- [隱私沙箱](https://developer.chrome.com/docs/privacy-sandbox/) 在 developer.chrome.com 上 +- [在 developer.chrome.com 上的圍欄頁框](https://developers.google.com/privacy-sandbox/relevance/fenced-frame) +- [隱私沙箱](https://developers.google.com/privacy-sandbox) 在 developer.chrome.com 上 diff --git a/files/zh-tw/web/html/element/footer/index.md b/files/zh-tw/web/html/element/footer/index.md index 95af2a742933a9..9629ebebf2fe54 100644 --- a/files/zh-tw/web/html/element/footer/index.md +++ b/files/zh-tw/web/html/element/footer/index.md @@ -53,7 +53,7 @@ footer { 在 Safari 13 之前的版本中，`contentinfo` [標誌角色](/zh-TW/docs/Learn/Accessibility/WAI-ARIA_basics#路標地標)未能被 [VoiceOver](https://help.apple.com/voiceover/info/guide/) 正確顯示。如果需要支持舊版 Safari 瀏覽器，請在 `footer` 元素中添加 `role="contentinfo"`，以確保該標誌能夠被正確顯示。 -- 相關：[WebKit Bugzilla: 146930 – AX: HTML native elements (header, footer, main, aside, nav) should work the same as ARIA landmarks, sometimes they don't](https://webkit.org/b/146930) +- 相關：[WebKit Bugzilla: 146930 – AX: HTML native elements (header, footer, main, aside, nav) should work the same as ARIA landmarks, sometimes they don't](https://bugs.webkit.org/show_bug.cgi?id%3D146930) ## 技術摘要 diff --git a/files/zh-tw/web/html/element/input/submit/index.md b/files/zh-tw/web/html/element/input/submit/index.md index 54f902f188fa1c..a90f0794a0d1f6 100644 --- a/files/zh-tw/web/html/element/input/submit/index.md +++ b/files/zh-tw/web/html/element/input/submit/index.md @@ -98,7 +98,7 @@ slug: Web/HTML/Element/input/submit > **備註：** 請參見 [``](/zh-TW/docs/Web/HTML/Element/input/button#Disabling_and_enabling_a_button) 頁面以取得關於禁用/啟用提交按鈕的詳細資訊。 -> **備註：** Firefox 不若其他瀏覽器，它預設上會在 {{HTMLElement("button")}} 跨網頁加載時[保持動態禁用狀態](http://stackoverflow.com/questions/5985839/bug-with-firefox-disabled-attribute-of-input-not-resetting-when-refreshing)。請用 [`autocomplete`](/zh-TW/docs/Web/HTML/Element/button#autocomplete) 屬性控制這個功能。 +> **備註：** Firefox 不若其他瀏覽器，它預設上會在 {{HTMLElement("button")}} 跨網頁加載時[保持動態禁用狀態](https://stackoverflow.com/questions/5985839/bug-with-firefox-disabled-attribute-of-input-not-resetting-when-refreshing)。請用 [`autocomplete`](/zh-TW/docs/Web/HTML/Element/button#autocomplete) 屬性控制這個功能。 ## 驗證 diff --git a/files/zh-tw/web/html/element/script/index.md b/files/zh-tw/web/html/element/script/index.md index 205f2ffe3c3903..882c941160b706 100644 --- a/files/zh-tw/web/html/element/script/index.md +++ b/files/zh-tw/web/html/element/script/index.md @@ -64,7 +64,7 @@ slug: Web/HTML/Element/script - **`module`**：針對相容 HTML5 的瀏覽器來說，這段程式碼會當成 JavaScript 模組（module）。腳本內容的處理不受 `charset` 與 `defer` 屬性影響。針對 `module` 的資訊，請參閱 [ES6 in Depth: Modules](https://hacks.mozilla.org/2015/08/es6-in-depth-modules/)。在使用 `module` 關鍵字時，程式碼的行為會有所不同。 - **其他值**：嵌入的內容會被當成一段不給瀏覽器執行的資料塊（data block）。開發者應當使用非 JavaScript 的有效 MIME 類型，以標明資料塊。`src` 屬性也將被忽略。 - > **備註：** 在 Firefox 你可以在 `