Edit

Page

Page title:

Page body:

[1] [[HTML]] の [DFN[[CODE(HTMLe)[td]] 要素型]]は、
[[表]]の[RUBYB[見出し[[こま]]][header cell]]をあらわします。

[6]
仕様書:
- [[HTML 4]]
-- [CSECTION[11.2.6 Table cells: The [CODE(HTMLe)[TH]] and [CODE(HTMLe)[TD]] elements]]
<IW:HTML4:"struct/tables.html#edef-TH">

[2]
:[[局所名]]:[CODE(HTMLe)[th]]
:[[名前空間名]]:[CODE(URI)[[[http://www.w3.org/1999/xhtml]]]]
:[[開始タグ]]:必須
:[[終了タグ]]:省略可能 (HTML 4), 必須 (XHTML 1)
:[[内容模型]]:[CODE[%[[flow]]*]]
:出現できる文脈:[CODE(HTMLe)[[[tr]]]] 直下
:[[属性]]:
,属性名,属性値,既定値,説明,状態,出典
,[CODE(HTMLa)[[[abbr]]]],[CODE[%[[Text]]]],(なし),省略形,[HTML 4]
,[CODE(HTMLa)[[[align]]]],,,揃え,[HTML 4] [CODE(SGML)[%[[cellhalign]]]]
,[CODE(HTMLa)[[[axis]]]],[CODE(ABNF)[#[CODE(SGML)[[[IDREF]]]]]],(なし),関連する見出し,[HTML 4]
,[CODE(HTMLa)[[[background]]]],[CODE(SGML)[%[[URI]]]],,背景画像,非標準
,[CODE(HTMLa)[[[bgcolor]]]],,,背景色,[HTML 4] 非推奨
,[CODE(HTMLa)[[[bordercolor]]]],[CODE(SGML)[%[[Color]]]],,境界色,非標準
,[CODE(HTMLa)[[[bordercolordark]]]],[CODE(SGML)[%[[Color]]]],,境界色,非標準
,[CODE(HTMLa)[[[bordercolorlight]]]],[CODE(SGML)[%[[Color]]]],,境界色,非標準
,[CODE(HTMLa)[[[char]]]],,,揃える文字,[HTML 4] [CODE(SGML)[%cellhalign]]
,[CODE(HTMLa)[[[charoff]]]],,,揃える文字,[HTML 4] [CODE(SGML)[%cellhalign]]
,[CODE(HTMLa)[[[class]]]]	,	,	,[[級]]	,[HTML 4] %[[coreattr]]
,[CODE(HTMLa)[[[colspan]]]],[CODE(SGML)[[[NUMBER]]]],[CODE(HTML)[1]],列またぎ,[HTML 4]
,[CODE(HTMLa)[[[dir]]]]	,	,	,[[書字方向]]	,[HTML 4] %[[i18n]]
,[CODE(HTMLa)[[[headers]]]],[CODE(SGML)[[[IDREFS]]]],(なし),見出しこま,[HTML 4]
,[CODE(HTMLa)[[[height]]]],,,高さ,[HTML 4] 非推奨
,[CODE(HTMLa)[[[id]]]]	,	,	,一意識別子	,[HTML 4] %coreattr
,[CODE(HTMLa)[[[lang]]]]	,	,	,[[自然言語]]	,[HTML 4] %i18n
,[CODE(HTMLa)[[[xml]]:lang]]	,	,	,自然言語	,[XHTML1]
,[CODE(HTMLa)[[[nowrap]]]],([[真偽値属性]]),(偽),折返しなし,[HTML 4] 非推奨
,[CODE(HTMLa)[[[onclick]]]]	,	,	,	,[HTML 4] %[[events]]
,[CODE(HTMLa)[[[ondblclick]]]]	,	,	,	,[HTML 4] %events
,[CODE(HTMLa)[[[onkeydown]]]]	,	,	,	,[HTML 4] %events
,[CODE(HTMLa)[[[onkeypress]]]]	,	,	,	,[HTML 4] %events
,[CODE(HTMLa)[[[onkeyup]]]]	,	,	,	,[HTML 4] %events
,[CODE(HTMLa)[[[onmousedown]]]]	,	,	,	,[HTML 4] %events
,[CODE(HTMLa)[[[onmousemove]]]]	,	,	,	,[HTML 4] %events
,[CODE(HTMLa)[[[onmouseout]]]]	,	,	,	,[HTML 4] %events
,[CODE(HTMLa)[[[onmouseover]]]]	,	,	,	,[HTML 4] %events
,[CODE(HTMLa)[[[onmouseup]]]]	,	,	,	,[HTML 4] %events
,[CODE(HTMLa)[[[rowspan]]]],[CODE(SGML)[[[NUMBER]]]],[CODE(HTML)[1]],行またぎ,[HTML 4]
,[CODE(HTMLa)[[[scope]]]],[CODE[%Scope]],(なし),見出し適用範囲,[HTML 4]
,[CODE(HTMLa)[[[style]]]]	,	,	,スタイル情報	,[HTML 4] %coreattr
,[CODE(HTMLa)[[[title]]]]	,	,	,注釈的題	,[HTML 4] %coreattr
,[CODE(HTMLa)[[[valign]]]],,,垂直配置,[HTML 4] [CODE(SGML)[%[[cellvalign]]]]
,[CODE(HTMLa)[[[width]]]],,,幅,[HTML 4] 非推奨
,[CODE(XMLa)[[[xmlns]]]],[CODE(URI)[[[http://www.w3.org/1999/xhtml]]]] 固定,==,[[名前空間名]],W3C 勧告,[[XHTML m12n]]

* 状態

[14] [CODE(DOMi)@en[HTMLElement]] の状態に加えて、
[FIG(list members)[
: [F[[CODE(DOMa)@en[headers]]]] : [CODE(DOMi)@en[DOMTokenList]]
]FIG]

* レンダリング

[3] [[UA]] は、見出しこま ([CODE(HTMLe)[th]]) とデータこま ([CODE(HTMLe)[[[td]]]])
の別を利用して、著者の[[スタイル・シート]]がなくとも表をそれっぽく表示できます。
HTML 4 仕様書に挙げられているレンダリング例:
- 見出しこまを[[太字]]で表示する
- 見出しこまをデータこまとは異なる抑揚で読上げる
- [5] 典型的レンダリング: 見出しこまを太字、水平垂直中央に配置
(<IW:HTML4:"struct/tables.html#alignment">)

UA は、見出しこまの内容または [CODE(HTMLa)[abbr]] 属性値のいずれかをレンダリングしなければなりません。
- [[視覚UA]] は、こまの内容をすべて表示するには場所が足りないときに
[CODE(HTMLa)[abbr]] を使うとよいかもしれません。
- 非視覚 UA は、こまの内容と一緒に見出しを表示するときには
[CODE(HTMLa)[abbr]] を使うとよいかもしれません。

[4] 多くの視覚 UA の既定スタイルは >>5 です。

[[#comment]]

** 例

[7]
[CODE(HTMLe)@en[[[th]]]] 中に [CODE(HTMLe)@en[[[p]]]] を使った例

;; [CITE@ja[NIKKEI NET(日経ネット):企業ニュース−企業の事業戦略、合併や提携から決算や人事まで速報]] ([TIME[2008-02-24 23:01:35 +09:00]] 版) <http://www.nikkei.co.jp/news/sangyo/20080224AT1D220AC22022008.html>

>
[PRE(HTML example code)[
<table cellspacing="0" class="mini-market-tbl">
<tr><th>ソニー</th><td><a href='http://rd.nikkei.co.jp/stock/h/6758' target='betsuwaku' onClick='s_objectID="N-linkst"; var s=s_gi("nikkeicojpnnetprod,nikkeicojpglobal");s.linkTrackVars="prop7";s.prop7="N-linkst";s.tl(this,"o","N-linkst");'>株価</a> | <a href='http://nikkei.goo.ne.jp/perfect/basic_1213.html' target='betsuwaku' onClick='s_objectID="N-linkst"; var s=s_gi("nikkeicojpnnetprod,nikkeicojpglobal");s.linkTrackVars="prop7";s.prop7="N-linkst";s.tl(this,"o","N-linkst");'>企業情報</a> | <a href='http://www.sony.co.jp' target='betsuwaku' onClick='s_objectID="N-linkst"; var s=s_gi("nikkeicojpnnetprod,nikkeicojpglobal");s.linkTrackVars="prop7";s.prop7="N-linkst";s.tl(this,"o","N-linkst");'>ホームページ</a></td></tr>

<tr><th>シャープ</th><td><a href='http://rd.nikkei.co.jp/stock/h/6753' target='betsuwaku' onClick='s_objectID="N-linkst"; var s=s_gi("nikkeicojpnnetprod,nikkeicojpglobal");s.linkTrackVars="prop7";s.prop7="N-linkst";s.tl(this,"o","N-linkst");'>株価</a> | <a href='http://nikkei.goo.ne.jp/perfect/basic_1209.html' target='betsuwaku' onClick='s_objectID="N-linkst"; var s=s_gi("nikkeicojpnnetprod,nikkeicojpglobal");s.linkTrackVars="prop7";s.prop7="N-linkst";s.tl(this,"o","N-linkst");'>企業情報</a> | <a href='http://www.sharp.co.jp/' target='betsuwaku' onClick='s_objectID="N-linkst"; var s=s_gi("nikkeicojpnnetprod,nikkeicojpglobal");s.linkTrackVars="prop7";s.prop7="N-linkst";s.tl(this,"o","N-linkst");'>ホームページ</a></td></tr>
<tr><th>松下電器産業</th><td><a href='http://rd.nikkei.co.jp/stock/h/6752' target='betsuwaku' onClick='s_objectID="N-linkst"; var s=s_gi("nikkeicojpnnetprod,nikkeicojpglobal");s.linkTrackVars="prop7";s.prop7="N-linkst";s.tl(this,"o","N-linkst");'>株価</a> | <a href='http://nikkei.goo.ne.jp/perfect/basic_1208.html' target='betsuwaku' onClick='s_objectID="N-linkst"; var s=s_gi("nikkeicojpnnetprod,nikkeicojpglobal");s.linkTrackVars="prop7";s.prop7="N-linkst";s.tl(this,"o","N-linkst");'>企業情報</a> | <a href='http://panasonic.co.jp/' target='betsuwaku' onClick='s_objectID="N-linkst"; var s=s_gi("nikkeicojpnnetprod,nikkeicojpglobal");s.linkTrackVars="prop7";s.prop7="N-linkst";s.tl(this,"o","N-linkst");'>ホームページ</a></td></tr>

<tr><th>日立製作所</th><td><a href='http://rd.nikkei.co.jp/stock/h/6501' target='betsuwaku' onClick='s_objectID="N-linkst"; var s=s_gi("nikkeicojpnnetprod,nikkeicojpglobal");s.linkTrackVars="prop7";s.prop7="N-linkst";s.tl(this,"o","N-linkst");'>株価</a> | <a href='http://nikkei.goo.ne.jp/perfect/basic_1161.html' target='betsuwaku' onClick='s_objectID="N-linkst"; var s=s_gi("nikkeicojpnnetprod,nikkeicojpglobal");s.linkTrackVars="prop7";s.prop7="N-linkst";s.tl(this,"o","N-linkst");'>企業情報</a> | <a href='http://www.hitachi.co.jp/' target='betsuwaku' onClick='s_objectID="N-linkst"; var s=s_gi("nikkeicojpnnetprod,nikkeicojpglobal");s.linkTrackVars="prop7";s.prop7="N-linkst";s.tl(this,"o","N-linkst");'>ホームページ</a></td></tr>
<tr><th>キヤノン</th><td><a href='http://rd.nikkei.co.jp/stock/h/7751' target='betsuwaku' onClick='s_objectID="N-linkst"; var s=s_gi("nikkeicojpnnetprod,nikkeicojpglobal");s.linkTrackVars="prop7";s.prop7="N-linkst";s.tl(this,"o","N-linkst");'>株価</a> | <a href='http://nikkei.goo.ne.jp/perfect/basic_1458.html' target='betsuwaku' onClick='s_objectID="N-linkst"; var s=s_gi("nikkeicojpnnetprod,nikkeicojpglobal");s.linkTrackVars="prop7";s.prop7="N-linkst";s.tl(this,"o","N-linkst");'>企業情報</a> | <a href='http://canon.jp/' target='betsuwaku' onClick='s_objectID="N-linkst"; var s=s_gi("nikkeicojpnnetprod,nikkeicojpglobal");s.linkTrackVars="prop7";s.prop7="N-linkst";s.tl(this,"o","N-linkst");'>ホームページ</a></td></tr>

</table>
]PRE]

[[#comment]]

** メモ

[[#comment]]

* メモ

[8] [CITE[IRC logs: freenode / #whatwg / 20100414]]
([TIME[2010-04-28 23:30:42 +09:00]] 版)
<http://krijnhoetmer.nl/irc-logs/whatwg/20100414#l-711>

[9] [CITE@en[Web Applications 1.0 r5464 Define <th> centering more accurately.Fixing http://www.w3.org/Bugs/Public/show_bug.cgi?id=9542]]
( ([TIME[2010-09-10 18:01:00 +09:00]] 版))
<http://html5.org/tools/web-apps-tracker?from=5463&to=5464>

[10] [CITE[IRC logs: freenode / #whatwg / 20130604]]
( ([TIME[2013-06-06 22:25:38 +09:00]] 版))
<http://krijnhoetmer.nl/irc-logs/whatwg/20130604#l-1372>

[11] [CITE@en[Fix #345: Remove table sorting model · whatwg/html@59b7e24]]
([TIME[2016-01-29 23:20:18 +09:00]] 版)
<https://github.com/whatwg/html/commit/59b7e2466c2b7c5c408a4963b05b13fd808aa07a>

[12] [CITE@en[Fix #345: Remove table sorting model · whatwg/html@59b7e24]]
([TIME[2016-01-29 23:26:24 +09:00]] 版)
<https://github.com/whatwg/html/commit/59b7e2466c2b7c5c408a4963b05b13fd808aa07a>

[13] [CITE@en[Merge the two table cell interfaces together · whatwg/html@e383ae2]]
([TIME[2016-04-27 17:04:43 +09:00]] 版)
<https://github.com/whatwg/html/commit/e383ae23776362cafb2fb4bbba70c8c9080d4b0f>

[15] [CITE@en[Editorial: Cross-reference DOM "child" where appropriate in rendering]]
([[zcorpan]]著, [TIME[2016-09-20 20:16:41 +09:00]])
<https://github.com/whatwg/html/commit/e8c91c05edc8d6cdb33fdd5452e052359d40490b>

[16] [CITE@en[Specifiy name and description rules for td, th and tr elements - issue …]]
([[asurkov]]著, [TIME[2018-05-28 23:30:45 +09:00]])
<https://github.com/w3c/html-aam/commit/7ef3eb19602be3179b39b728494639788c9f4f36>

[17] [CITE@en[Specifiy name and description rules for td, th and tr elements - issu… by asurkov · Pull Request #132 · w3c/html-aam]]
([TIME[2018-06-01 01:04:54 +09:00]])
<https://github.com/w3c/html-aam/pull/132>

[18] [CITE@en[HTML-AAM: td and tr Name and Description Computation not specified · Issue #44 · w3c/html-aam]]
([TIME[2018-06-01 01:05:23 +09:00]])
<https://github.com/w3c/html-aam/issues/44>

[19] [CITE@en[Change <td hidden> to render as display: none]]
([[zcorpan]]著, [TIME[2018-06-05 16:21:10 +09:00]])
<https://github.com/whatwg/html/commit/b3c7c89e198bcebefab7c57777e9564ecd83f7e4>

[20] [CITE@en[Specifiy name and description rules for td, th and tr elements - issue …]]
([[asurkov]]著, [TIME[2018-05-28 23:30:45 +09:00]])
<https://github.com/w3c/html-aam/commit/7ef3eb19602be3179b39b728494639788c9f4f36>

[21] [CITE@en[Specifiy name and description rules for td, th and tr elements - issu… by asurkov · Pull Request #132 · w3c/html-aam]]
([TIME[2019-02-23 18:08:24 +09:00]])
<https://github.com/w3c/html-aam/pull/132>

[22] [CITE@en[HTML-AAM: td and tr Name and Description Computation not specified · Issue #44 · w3c/html-aam]]
([TIME[2019-02-23 18:08:38 +09:00]])
<https://github.com/w3c/html-aam/issues/44>

[23] [CITE@en[HTML-AAM: td and tr Name and Description Computation not specified · Issue #352 · w3c/aria]]
([TIME[2019-02-23 18:09:03 +09:00]])
<https://github.com/w3c/aria/issues/352>

Historical Legal Sensitive Parent: [Help / License]

Edit

Page

Page name(s)