HTML <th> tablo hücresi için birkaç sütuntan daha geniş olan kapsam alanı değeri nedir?

Question

Çeşitli sütunları ör. <th> hücresine sahip bir HTML tablonuz olduğunu varsayalım.

<table> 
    <tr> 
     <th colspan="3" scope="?">Scores</th> 
     <!-- ...more headings here... --> 
    </tr> 
    <tr> 
     <th scope="col">English</th> 
     <th scope="col">Maths</th> 
     <th scope="col">Science</th> 
     <!-- ...more sub-headings here... --> 
    </tr> 
    <tr> 
     <td>12</td> 
     <td>16</td> 
     <td>20</td> 
     <!-- ...more cells here... --> 
    </tr> 
</table> 

Kapsam başlık hücresi için kapsam özniteliği için doğru değer nedir? col, bazı sütunlara yöneldiğinden hatalı görünüyor, ancak colgroup, aslında colgroup etiketine sahip değilseniz doğru görünmüyor.

Answer 1

HTML tekniklerindeki ikinci örnek tabloya göre, colgroup etiketlerinin olmamasına rağmen, colgroup.

http://www.w3.org/TR/html4/struct/tables.html#h-11.4.1

Answer 2

WebAIM (Mind Web Erişilebilirlik) grubunun creating accessible data tables üzerine harika bir yazı vardır. Genel olarak, ekran okuyucuların işaretlemeyi güvenilir bir şekilde yorumlayamadıklarından, yayılmış satır veya sütunlardan kaçınmanızı öneririz.

Yayılmış sütunlardan tamamen kaçınmanın kısa bir kısmı, kapsam özniteliğiyle birlikte id/header özniteliklerini kullanarak gerçekten çok şansım oldu. İşaretleme daha ayrıntılı olsa da, bu JAWS için işleri basitleştirir ve sonuç olarak verileri yorumlamada daha az sorun yaşar. ...

<table> 
    <tr> 
     <th id="scores" colspan="3">Scores</th> 
    </tr> 
    <tr> 
     <th id="english" scope="col">English</th> 
     <th id="maths" scope="col">Maths</th> 
     <th id="science" scope="col">Science</th> 
    </tr> 
    <tr> 
     <td headers="scores english">12</td> 
     <td headers="scores maths">16</td> 
     <td headers="scores science">20</td> 
    </tr> 
</table> 

Answer 3

Belki başlık özellik sizin için daha uygun olabilir

<table> 
    <caption>Scores</caption> 
    <thead> 
    <tr> 
     <th scope="col">English</th> 
     <th scope="col">Maths</th> 
     <th scope="col">Science</th> 
    </tr> 
    </thead> 
    <tbody> 
    <tr> 
     <td>12</td> 
     <td>16</td> 
     <td>20</td> 
    </tr> 
    </tbody> 
</table> 

https://developer.mozilla.org/en-US/docs/Web/HTML/Element/caption