diff options
author | t7yang <t7yang@gmail.com> | 2021-07-17 15:47:55 +0800 |
---|---|---|
committer | Irvin <irvinfly@gmail.com> | 2021-07-19 23:04:27 +0800 |
commit | 8af4d5e8a260f3474b4273d573532ec6fec08ab4 (patch) | |
tree | 2af9751507e1f973e5ddbd075d32e571df1c7658 /files/zh-tw/learn/html/tables/basics | |
parent | 253bf68f4a0bb343bb556c9ba54c7f9410471e08 (diff) | |
download | translated-content-8af4d5e8a260f3474b4273d573532ec6fec08ab4.tar.gz translated-content-8af4d5e8a260f3474b4273d573532ec6fec08ab4.tar.bz2 translated-content-8af4d5e8a260f3474b4273d573532ec6fec08ab4.zip |
replace wiki links in zh-TW
Diffstat (limited to 'files/zh-tw/learn/html/tables/basics')
-rw-r--r-- | files/zh-tw/learn/html/tables/basics/index.html | 10 |
1 files changed, 5 insertions, 5 deletions
diff --git a/files/zh-tw/learn/html/tables/basics/index.html b/files/zh-tw/learn/html/tables/basics/index.html index 73b80e5d14..c95dbdbdf1 100644 --- a/files/zh-tw/learn/html/tables/basics/index.html +++ b/files/zh-tw/learn/html/tables/basics/index.html @@ -15,7 +15,7 @@ original_slug: Learn/HTML/Tables/基礎 <tr> <th scope="row">先備知識:</th> <td> - <p>HTML的基礎(見<a href="https://wiki.developer.mozilla.org/en-US/docs/Learn/HTML/Introduction_to_HTML">介紹HTML</a>)</p> + <p>HTML的基礎(見<a href="/zh-TW/docs/Learn/HTML/Introduction_to_HTML">介紹HTML</a>)</p> </td> </tr> <tr> @@ -184,20 +184,20 @@ original_slug: Learn/HTML/Tables/基礎 <p>你也可以在 <a href="https://mdn.github.io/learning-area/html/tables/assessment-finished/planets-data.html">GitHub </a> 上看看實際範例 ! 而你也許會注意到那裡的表格似乎更容易閱讀。那是因為這裡的表格只有加上很少樣式,而GitHub上的版本卻應用上了更多明顯的CSS 。</p> -<p>需要弄清楚的一點是 : 要讓表格在網頁上有效呈現需要提供紮實的HTML架構和CSS樣式資訊,但將在這個模組中聚焦在HTML的部分。若想瞭解CSS的部分,可以在完成這部分閱讀之後造訪<a href="https://wiki.developer.mozilla.org/zh-CN/docs/Learn/CSS/Building_blocks/Styling_tables">表格樣式設計</a>的文章。</p> +<p>需要弄清楚的一點是 : 要讓表格在網頁上有效呈現需要提供紮實的HTML架構和CSS樣式資訊,但將在這個模組中聚焦在HTML的部分。若想瞭解CSS的部分,可以在完成這部分閱讀之後造訪<a href="/zh-TW/docs/Learn/CSS/Building_blocks/Styling_tables">表格樣式設計</a>的文章。</p> <p>在這個單元裡我們將不會聚焦在CSS上,但是我們提供基本的CSS樣式表讓你做使用,這將會使你製作的表格比起毫無修飾的預設樣式更方便閱讀。你能在這找到<a href="https://github.com/mdn/learning-area/blob/master/html/tables/basic/minimal-table.css">樣式表</a>,並且你也能找到一個適用於樣式表的<a href="https://github.com/mdn/learning-area/blob/master/html/tables/basic/blank-template.html">HTML模版</a> — 他們能一起讓你有個好起點來實驗HTML表格。</p> <h3 id="當何時你不應該使用HTML表格">當何時你不應該使用HTML表格?</h3> <p>HTML表格應該被使用在結構化資料(tabular data)上 — 這就是它們被設計的目的。<br> - 不幸地是,許多人習慣使用HTML表格去排版他們的網頁,例如: 使用一列去當header,一列當做內容欄位,一列當作footer...等等,你能在我們的<a href="https://wiki.developer.mozilla.org/en-US/docs/Learn/Accessibility">輔助學習單元</a>裡的<a href="https://wiki.developer.mozilla.org/en-US/docs/Learn/Accessibility/HTML#Page_layouts">頁面輸出</a>發現更多細節以及一個範例。它曾經被這麼使用是因為CSS過去在不同瀏覽器之間的支援程度十分可怕; 如今,已非常少在用表格做排版,但你仍然可能在網路的一些邊邊角角見到。</p> + 不幸地是,許多人習慣使用HTML表格去排版他們的網頁,例如: 使用一列去當header,一列當做內容欄位,一列當作footer...等等,你能在我們的<a href="/zh-TW/docs/Learn/Accessibility">輔助學習單元</a>裡的<a href="/zh-TW/docs/Learn/Accessibility/HTML#Page_layouts">頁面輸出</a>發現更多細節以及一個範例。它曾經被這麼使用是因為CSS過去在不同瀏覽器之間的支援程度十分可怕; 如今,已非常少在用表格做排版,但你仍然可能在網路的一些邊邊角角見到。</p> -<p>簡單來說,使用表格排版而非使用<a href="https://wiki.developer.mozilla.org/en-US/docs/Learn/CSS/CSS_layout">CSS排版技術</a>是一件很糟的事情。<br> +<p>簡單來說,使用表格排版而非使用<a href="/zh-TW/docs/Learn/CSS/CSS_layout">CSS排版技術</a>是一件很糟的事情。<br> 下列是主要原因:</p> <ol> - <li><strong>表格排版會減少對視障使用者的輔助 </strong>: 視障者使用的<a href="https://wiki.developer.mozilla.org/en-US/docs/Learn/Tools_and_testing/Cross_browser_testing/Accessibility#Screenreaders">螢幕閱讀器</a>會翻譯存在於HTML網頁的標籤並對使用者念出內容。由於表格並不是正確的排版工具,並且標示方式遠複雜於CSS排版技術,所以螢幕閱讀器輸出的內容會使他們的使用者感到困惑。</li> + <li><strong>表格排版會減少對視障使用者的輔助 </strong>: 視障者使用的<a href="/zh-TW/docs/Learn/Tools_and_testing/Cross_browser_testing/Accessibility#Screenreaders">螢幕閱讀器</a>會翻譯存在於HTML網頁的標籤並對使用者念出內容。由於表格並不是正確的排版工具,並且標示方式遠複雜於CSS排版技術,所以螢幕閱讀器輸出的內容會使他們的使用者感到困惑。</li> <li><strong>表格會產生標籤雜燴(tag soup)</strong>: 就像上面提到的,表格排版通常會比一般適當的輸出技術包含更複雜的標籤結構。這會導致程式碼本身更難撰寫、維護及debug。</li> <li><strong>表格不會自適應(automatically responsive)</strong>: 當你使用合適的排版容器(像是{htmlelement("header")}, {{htmlelement("section")}}) 或是 {{htmlelement("div")}}),它們的寬度相對於父層預設為100%,而表格的預設大小是依據它們的內容物,所以當表格樣式要有效的在不同的裝置之間運行時,會需要做額外的測量調整。</li> </ol> |