中文字幕二区_国产精品免费在线观看_黄色网站观看_人人草人人澡_日本真实娇小xxxx

表頭與數(shù)據(jù)的關(guān)系

我們可以利用headers屬性把表頭和對(duì)應(yīng)的<td>中的數(shù)據(jù)關(guān)聯(lián)起來,使屏幕閱讀器能更容易為需要的人們組織表格內(nèi)容.在使用了這個(gè)屬性之后,屏幕閱讀器將能更符合邏輯的讀出表格內(nèi)容,而不是像平常一樣死板的從每列最左邊讀到最右邊.

我們繼續(xù)使用紅襪隊(duì)?wèi)?zhàn)績(jī)表當(dāng)作例子來示范使用方法.首先,我們需要為<表格中的每個(gè)<th>加上一個(gè)唯一的id,接著再為每個(gè)資料單元格加上headers屬性,對(duì)應(yīng)正確的表頭.

為每個(gè)表頭加上id很簡(jiǎn)單,就是這樣:

<table summary="This table is a chart of all Boston Red Sox World Series wins.">
  <caption>Boston Red Sox World Series Championships</caption>
  <tr>
     <th id="year">Year</th>
     <th id="opponent">Opponent</th>
     <th id="record">Season  Record (W-L)</th>
  </tr>
  <tr>
     <td>1918</td>
     <td>Chicago Cubs</td>
     <td>75-51</td>
  </tr>
  <tr>
     <td>1916</td>
     <td>Brooklyn Robins</td>
     <td>91-63</td>
  </tr>
  <tr>
     <td>1915</td>
     <td>Philadelphia Phillies</td>
     <td>101-50</td>
  </tr>
  <tr>
     <td>1912</td>
     <td>New York Giants</td>
     <td>105-47</td>
  </tr>
</table>

我們?yōu)槊總�(gè)表頭id選擇簡(jiǎn)短的有描述意義的名稱,接著我們?cè)贋槊總�(gè)資料單元格加上適當(dāng)?shù)膆eaders屬性,讓內(nèi)容匹配正確的表頭id:

<table summary="This table is a chart of all Boston Red Sox World Series wins.">
  <caption>Boston Red Sox World Series Championships</caption>
  <tr>
     <th id="year">Year</th>
     <th id="opponent">Opponent</th>
     <th id="record">Season  Record (W-L)</th>
  </tr>
  <tr>
     <td headers="year">1918</td>
     <td headers="opponent">Chicago Cubs</td>
     <td headers="record">75-51</td>
  </tr>
  <tr>
     <td headers="year">1916</td>
     <td headers="opponent">Brooklyn Robins</td>
     <td headers="record">91-63</td>
  </tr>
  <tr>
     <td headers="year">1915</td>
     <td headers="opponent">Philadelphia Phillies</td>
     <td headers="record">101-50</td>
  </tr>
  <tr>
     <td headers="year">1912</td>
     <td headers="opponent">New York Giants</td>
     <td headers="record">105-47</td>
  </tr>
</table>

在為表頭和內(nèi)容之間建立對(duì)應(yīng)關(guān)系后,屏幕閱讀器可能會(huì)議這樣的方式讀出表格的每一行內(nèi)容: "Year:1918,Opponent:Chicago Cubs,Season Record(W-L):75-51",比起從左到右讀出每格內(nèi)容的方法來說,這樣就有意義多了.

讓每個(gè)<th>具有唯一的id還有其他的好處,我們可以使用這個(gè)辨別依據(jù),設(shè)定特殊的css規(guī)則,在本章最后的技巧延伸終究會(huì)討論這個(gè)方法.

出處：藍(lán)色理想
責(zé)任編輯：bluehearts

上一頁(yè) 標(biāo)記語(yǔ)言——邪惡的表格? [2] 下一頁(yè) 標(biāo)記語(yǔ)言——邪惡的表格? [4]

◎進(jìn)入論壇網(wǎng)頁(yè)制作、WEB標(biāo)準(zhǔn)化版塊參加討論，我還想發(fā)表評(píng)論。