2010-03-24 44 views
21

如果是這樣的結構:把 放在空的​​裏面好嗎?

<table cellspacing="0" cellpadding="0"> 
    <tr> 
     <td>I don't need anything here, should I always put a &nbsp; here?</td> 
     <td>item </td> 
    </tr> 
    <tr> 
     <td>model</td> 
     <td>one</td> 
    </tr> 
    <tr> 
     <td>model</td> 
     <td>two</td> 
    </tr> 
    <tr> 
     <td>model</td> 
     <td>three</td> 
    </tr> 
</table> 

如何將屏幕閱讀器讀取一個空白td?它在語義上是正確的嗎?

回答

12

語義正確恕我直言,是保持一個空單元格真的空。但是,由於實際的原因,我也會用&nbsp;填充空單元格。

至於屏幕閱讀器,我必須做出一個有根據的猜測:空的節點可能不會被讀取,因爲HTML主要由空白文本節點組成,讀者忽略,並且我認爲&nbsp;已摺疊爲讀者應用(因爲不破是視覺媒體的財產)簡單的空間。

對於渲染視覺上,人們可以依靠CSS表格屬性empty-cells

table { 
    empty-cells: show; 
} 
+2

我認爲這個屬性在IE不支持 – 2010-03-24 09:14:18

+3

這是真的,原因是,爲什麼我仍然在使用' 's,不幸的。 – Boldewyn 2010-03-24 09:29:38

+2

根據[MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/empty-cells),'empty-cells'屬性在IE 8中支持。 – 2015-02-03 23:35:35

0

沒有什麼確切說你不應該使用使用空白TD,並把它傳遞當您嘗試驗證。

雖然更優雅的方法是使用colspan。

<tr> 
    <td colspan="2">item </td> 
</tr> 

但這將調整你的內容到左邊,你就會有這樣的內容對準您想要手動(通過CSS)應用樣式。

如何使用它colspans的好處是,屏幕閱讀器將讀取只有那裏的東西,而不是空的空間

+4

'colspan'不是更優雅或語義的必要條件。 「colspan」有效地表示,表格單元格的值是通常屬於兩個不同單元格的值的有效組合。在上面的例子中:如果第一行是一個標題,那麼'colspan'會給出一個完全錯誤的結果(即單元格內容被標記爲* both *列的標籤)。 – Boldewyn 2010-03-24 09:32:58

2

感謝像Dreamweaver編輯這種做法有些標準就成了,所以即使是不是一個完美的解決方案 - 至少你不會一個人做這件事。另外,它比舊版瀏覽器更能兼容CSS的empty-cells

4

語義上,一個HTML表格實際上只是數據的陣列(矩陣),而且也沒有理由無間斷空格字符不能被視爲數據。是否真的有意義取決於表的目的,結構和內容。在大多數情況下,有一個更好的解決方案。請參閱Empty cells in HTML tables中的一些建議。

在技術方面,在無間斷空間具有寬度和高度,根據字體,並且這不會對細胞的尺寸的最低要求。這可能很重要,儘管大多數情況下在行或列用作分隔符的情況下,例如,創建水平或垂直線。

與使用正常空間或使單元完全空白相反,使用不間斷空間的另一個影響是,它可能會影響單元格內​​的單元格,背景顏色和背景圖像周圍邊框的外觀。

屏幕閱讀器指示空單元格的方式不同(如果有的話),這也可能取決於閱讀模式。在任何情況下,用戶都不知道真正發生了什麼,即什麼是空單元(如果空單傳遞給用戶)意味着什麼。在視覺瀏覽中,含義可能(或可能不)相當明顯。