戻る

headers, scope属性

表のデータとそれに対応する見出の指定。 この属性は非視覚系のブラウザがHTMLを解釈するのを助ける。 たとえばHTML文章を音声で読み上げたりするような物である。

headers
当該コマの見出となっているコマを指定する。 見出となっているコマにはid属性を用いて名前を付けなければならない。 複数のコマを指定する場合はスペースで区切る。
scope
コマに見出をつけた場合、 その見出の適用範囲を指定する。
scope="row"
当該コマ以下の行
scope="col"
当該コマが存在する列の、当該コマ以下の部分。
scope="rowgroup"
同じ行グループに属するコマ
scope="colgroup"
同じ列グループに属するコマ

<TABLE border="1"
          summary="">
<TR>
   <!-- 以下の4コマを見出とするため、id属性で名前を付ける。
        名前は同じHTML文章内で重複してはならない -->
   <TH id="t1">幹部名</TH>
   <TH id="t2">妹がいるか?</TH>
   <TH id="t3" abbr="妹">妹萌度</TH>
   <TH id="t4">画力</TH>
<TR>
   <!-- t1〜t4 を各々見出としている -->
   <TD headers="t1">E君</TD>
   <TD headers="t2">2人</TD>
   <TD headers="t3">0</TD>
   <TD headers="t4">280萌</TD>
<TR>
   <!-- t1〜t4 を各々見出としている -->
   <TD headers="t1">Dr.K</TD>
   <TD headers="t2">0</TD>
   <TD headers="t3">0</TD>
   <TD headers="t4">480萌</TD>
</TABLE>
    

例をHTMLにしてみました。

上の例をscopeを用いて書き直すと

<TABLE border="1"
          summary="">
<TR>
   <!-- 以下の4コマを同じ列の下のコマに対する見出とする。-->
   <TH scope="col">幹部名</TH>
   <TH scope="col">妹がいるか?</TH>
   <TH scope="col" abbr="妹">妹萌度</TH>
   <TH scope="col">画力</TH>
<TR>
   <TD>E君</TD>
   <TD>2人</TD>
   <TD>0</TD>
   <TD>280萌</TD>
<TR>
   <TD>Dr.K</TD>
   <TD>0</TD>
   <TD>0</TD>
   <TD>480萌</TD>
</TABLE>
    

例をHTMLにしてみました。


戻る