-
Notifications
You must be signed in to change notification settings - Fork 4
/
494.txt
416 lines (269 loc) · 18 KB
/
494.txt
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
* 表系要素 height 属性
** th 要素・td 要素 height 属性 (HTML, XHTML 1)
[21] [CODE(HTMLe)[[[th]]]] 要素および [CODE(HTMLe)[[[td]]]]
要素の [DFN[[CODE(HTMLa)[height]] 属性]]は、
[[視覚UA]] に対して推奨こま高を指定します。
仕様書:
- [[HTML 4]]
-- [CODE(HTMLe)[th]] 要素 [CODE(HTMLa)[height]] 属性
<IW:HTML4:"struct/tables.html#adef-height-TH">
-- [CITE[A.1.3 Minor typographical errors that were corrected]]
<IW:HTML4:"appendix/changes.html#h-A.1.3">
[[#comment]]
*** スタイル・シート代替
[22] この属性は'''非推奨'''です。[[スタイル・シート]]で代わりに指定できます。
[[#comment]]
*** 属性値
[23] この属性の値は [CODE[%[[Length]]]] です。
[WEAK[(HTML 4.0 では [CODE(SGML)[%[[Pixels]]]] でしたが、 [Q[minor typo]] として [SRC[HTML 4.01 A.1.3]]、百分率値を認めるために HTML 4.01 で [CODE(SGML)[%[[Length]]]] になりました。)]]
[[SGML]] 的には [CODE(SGML)[[[CDATA]]]] です。
[24] この属性は省略可能です。
[[#comment]]
*** メモ
[25] こまに一々高さなんて指定しても何の役に立つんだか。
[[#comment]]
** メモ
[[#comment]]
* img 要素・object 要素 height 属性 (HTML, XHTML 1)
[34] [[HTML]] の [CODE(HTMLe)[[[img]]]] 要素および
[CODE(HTMLe)[[[object]]]] 要素の [DFN[[CODE(HTMLa)[height]] 属性]]は、
[[画像]]や[[物体]]の自然な高さを上書きする値を指定します。
[35] 仕様書: [[HTML 4]]
<IW:HTML4:"struct/objects.html#img-wh">
[48]
HTML 4 DTD の[[注釈]] (参考)
には [Q[override height]] と書かれています。
([[名無しさん]] [sage])
[[#comment]]
** 代替
[38] この属性は、 HTML 4 では個別の属性としては'''非推奨'''にされていませんが、
視覚表現に関わる属性はすべて'''非推奨'''と書かれている章
(13.7 Visual presentation of images, objects, and applets
<IW:HTML4:"struct/objects.html#visual">) の中で規定されています。
[39] 画像や物体の高さは[[スタイル・シート]]で代替できます。
[[CSS]] では [CODE(CSS)[height]] 特性がこれにあたります。
[[#comment]]
** 属性値
[36] この属性の値は [CODE(SGML)[%[[Length]]]] です。
[[SGML]] 的には [CODE(SGML)[[[CDATA]]]] です。
百分率値で指定されたときには、利用可能な領域の高さに対する割合として解釈します。
(画像・物体の自然な高さに対してでは''ありません''。) [SUP[ [HTML 4] ]]
[37] この属性は省略可能です。
[[#comment]]
** 応用
[40] 物体が画像であるときには、指定された高さに合わせて拡大・縮小されます。 UA は、
物体や画像が [CODE(HTMLa)[height]] に一致するよう拡大・縮小に最善を尽くすべきです。
[SUP[ [HTML 4] ]]
[41] [CODE(HTMLa)[height]] 属性が指定されていると、 UA
は物体を取寄せる前に必要な領域を予約して残りの部分をレンダリングすることができます。
物体が到着しても全体ないし物体以後の部分をレンダリングし直さずに済みます。
回線や計算機の能力が貧弱だった時代には、
この理由から [CODE(HTMLa)[height]] や [CODE(HTMLa)[[[width]]]]
を [CODE(HTMLe)[img]] 要素に指定することが好ましいと言われていたこともありました。
[[#comment]]
** width 属性・height 属性は物理属性か?
[15] 特に [[Stricter]] の間では、 [CODE(HTML)[IMG]]
要素の [[width]], [[height]] 両属性が論理属性なのか物理属性
(表現属性) なのかが議論となることがあります。たとえば:
- ''agenda - 2002/5/16〜31 - Personnel'' <http://members.jcom.home.ne.jp/jintrick/Personal/d20025l.html>
- ''agenda - 2002/6/1〜15 - Personnel'' <http://members.jcom.home.ne.jp/jintrick/Personal/d20026f.html>
なお、以降において、具体的な仕様や実装を念頭に置くときはそれを明記し、明記しない場合は現実の使われ方を無視した、理想的なあり方を考えることとします。
[16] 論理属性として意識している場合:
- 画像の実際の大きさを表す参考情報。
-- 画像 (= 別資源) に内在している情報を持つことにやや抵抗がありますが、 [[type]] 属性の同類と考えればすっきりします。
無視していいのです。
- 関連付けられた image map の座標系 (というか単位長) の確定のための情報
物理属性として意識している場合:
- 画像の拡大・縮小を狙って実際の大きさと異なる値を指定
- 画像非表示状態の場合に、代替内容の大きさを無視してこの属性の値で表示
- 画像到着前の仮表示における大きさの推定
[17] でも実際のところ、 [CODE(HTML)[WIDTH]] 属性,
[CODE(HTML)[HEIGHT]] 属性には表示上の大きさを示す以上の使い方は出来ない気がする。
(大きさを知ってから取り寄せる、という使い方は、
(ブラウザでなく) 画像取り出し器が使うみたいな場合以外つかわなそうだ。)
廃止しても良いのじゃないかな。もしどうしても必要なら、
content feature の埋め込み ([[CC/PP]] かなにか?)
でも使って表現するのがいいのでは。
(Image map は、別の方法を考えるとして。)
[18] 今まで両属性の strict DTD における存在について判断しかねていたんですけど、 [[agenda]] のそふぃあさんの文章を読んで、あってもいいかなあと思うようになりました。でも想定される用途の幅と誤用の危険性を考えれば、なくてもいいかなあとも思います。個人的意見ですが。
[44]
[CODE(HTMLa)[width]] も [CODE(HTMLa)[height]] も、
HTML 4 仕様書では 13.7 Visual presentation of images, objects, and applets
のところに解説があるんだから、物理属性以外の何者でもない。
論理的意味があるようなことは一言も書いてないし。
しかも、属性そのものこそ非推奨ではないけど、
[Q[attributes that concern visual alignment and presentation have been deprecated in favor of style sheets]]
と前置きされた章の中にあるのだからあまりおすすめされているものでもなさそう。
[50]
百分率が画像自体ではなく領域に対するものである (>>36)
辺り、やはり物理属性だよなーと思った。
([[名無しさん]])
[65]
[CITE[img tag に height、width 属性は書くべきではない。]] ([[RobaQ]] 著, [CODE[2002-05-22 21:55:09 +09:00]] 版) <http://web.archive.org/web/20020528070539/http://www.netlaputa.ne.jp/~robaq/img_size.html>
([[名無しさん]])
[71]
[CITE[Re: require img dimensions to be correct?]] ([[Ian Hickson <ian@...>]] 著, [TIME[2008-04-11 07:02:20 +09:00]] 版) <http://permalink.gmane.org/gmane.org.w3c.whatwg.discuss/13682>
([[名無しさん]])
[[#comment]]
** 歴史
[62] [CODE(HTMLe)@en[[[img]]]] [[要素]]の [CODE(HTMLa)@en[[[height]]]]
[[属性]]は [[HTML 2.0]] の拡張として [[Netscape Navigator]]
が実装しました。
この[[属性]]は主として[[文書]]の[[レンダリング]]の高速化のために追加されたと説明されています。
この[[属性]]が指定されていると、[[画像]]の到着を待たずに[[レンダリング]]ができるとされています。
;; [CITE[Netscape Navigator Extensions to HTML]] <http://web.archive.org/web/20000415023954/http://www.netscape.com/home/services_docs/html-extensions.html>
@@
[62] 指定されていないと[[画像]]が到着されるまでまったく[[レンダリング]]が停止するように書かれていますが、
当時の [[Netscape Navigator]] はそうだったのでしょうか?
[[Netscape Navigator]] 2.0 は到着しなくても[[レンダリング]]を開始し、
[[画像]]が到着した時点で挿入される (ので、
それ以後が再描画される) ようになっていた記憶があります。
(だから再描画いくないから [CODE(HTMLa)@en[[[width]]]] と
[CODE(HTMLa)@en[[[height]]]] を指定汁みたいな話だったような。)
[[#comment]]
** メモ
[63]
[CITE@ja[FCafe IMGタグのsize指定]] ([CODE[2007-08-06 20:47:52 +09:00]] 版) <http://pcafe.blog3.fc2.com/blog-entry-486.html>
([[名無しさん]] [WEAK[2007-08-06 11:54:29 +00:00]])
[64]
>>63 こういう定量的な調査はもっとされてていいと思うんだが。。。
([[名無しさん]])
[[#comment]]
* applet 要素 height 属性 (HTML, XHTML 1)
[28] [[HTML]] の [CODE(HTMLe)[[[applet]]]] 要素の
[DFN[[CODE(HTMLa)[height]] 属性]]は、
applet の初期表示領域 (applet が作る[[窓]]や[[対話]]を除きます。)
の高さを指定します。
[29] 仕様書:
[[HTML 4]] <IW:HTML4:"struct/objects.html#adef-height-APPLET">
[49]
HTML 4 DTD の[[注釈]] (参考) には
[Q[initial height]] と書かれています。
([[名無しさん]] [sage])
[[#comment]]
** 代替
[30] この属性は HTML 4 で要素型ごと'''非推奨'''とされています。
[CODE(HTMLe)[[[object]]]] 要素型と[[スタイル・シート]]で代替できます。
[[#comment]]
** 属性値
[31] この属性の値は [CODE(SGML)[%[[Length]]]] です。
[[SGML]] 的には [CODE(SGML)[[[CDATA]]]] です。
大文字・小文字は区別されません [SUP[ [HTML 4] ]]。
(区別しようにも大文字も小文字も使えないのですが。)
[32] この属性は必須です。省略できません。
[[#comment]]
** 他との関係
[33] 姉妹属性 [CODE(HTMLa)[[[width]]]] (高さ) があります。
[[#comment]]
** メモ
[[#comment]]
* iframe 要素 width 属性 (HTML, XHTML 1)
[3] [[HTML]] の [CODE(HTMLe)[[[iframe]]]] 要素の
[DFN[[CODE(HTMLa)[height]] 属性]]は、
[[行内フレーム]]の高さを指定します。
[4] 仕様書:
- [[HTML 4]]
-- [CODE(HTMLe)[iframe]] 要素 [CODE(HTMLa)[height]] 属性
<IW:HTML4:"present/frames.html#adef-height-IFRAME">
[[#comment]]
** 属性値
[45] この属性の値は [CODE(SGML)[%[[Length]]]] です。
[[SGML]] 的には [CODE(SGML)[[[CDATA]]]] です。
[46] この属性は省略可能です。
[[#comment]]
** 他との関係
[47] 姉妹属性 [CODE(HTMLa)[[[width]]]] があります。
[[#comment]]
** メモ
[[#comment]]
* メモ
[66]
[CODE(CSS)@en[[[height]]]] の[[算出値]]確認用
[CODE(CSS)@en[[[display]]: [[inline]]]] ([[非置換行内要素]])
<http://suika.fam.cx/gate/2007/cssom/viewer?c=p%20%7B%0A%20%20display%3A%20inline%3B%0A%20%20height%3A%2010em%3B%0A%7D;h=%3Cinput%20type%3Dbutton%20onclick%3D%22%0A%20%20var%20el%20%3D%20document.getElementsByTagName%20('p')%5B0%5D%3B%0A%20%20var%20sd%20%3D%20getComputedStyle%20(el%2C%20null)%3B%0A%20%20w%20('getComputedStyle%3A%3A%20display%3A%20'%2Bsd.display%2B'%2C%20height%3A%20'%2Bsd.height)%0A%22%20value%3DgetComputedStyle%3E%0A%3Cinput%20type%3Dbutton%20onclick%3D%22%0A%20%20var%20el%20%3D%20document.getElementsByTagName%20('p')%5B0%5D%3B%0A%20%20var%20sd%20%3D%20el.currentStyle%3B%0A%20%20w%20('currentStyle%3A%3A%20display%3A%20'%2Bsd.display%2B'%2C%20height%3A%20'%2Bsd.height)%0A%22%20value%3DcurrentStyle%3E%0A%3Cp%3E;p=n;x=style-element>
[CODE(CSS)@en[[[display]]: [[table-column]]]]
<http://suika.fam.cx/gate/2007/cssom/viewer?c=col%20%7B%0A%20%20height%3A%2010em%3B%0A%7D;h=%3Cinput%20type%3Dbutton%20onclick%3D%22%0A%20%20var%20el%20%3D%20document.getElementsByTagName%20('col')%5B0%5D%3B%0A%20%20var%20sd%20%3D%20getComputedStyle%20(el%2C%20null)%3B%0A%20%20w%20('getComputedStyle%3A%3A%20display%3A%20'%2Bsd.display%2B'%2C%20height%3A%20'%2Bsd.height)%0A%22%20value%3DgetComputedStyle%3E%0A%3Cinput%20type%3Dbutton%20onclick%3D%22%0A%20%20var%20el%20%3D%20document.getElementsByTagName%20('col')%5B0%5D%3B%0A%20%20var%20sd%20%3D%20el.currentStyle%3B%0A%20%20w%20('currentStyle%3A%3A%20display%3A%20'%2Bsd.display%2B'%2C%20height%3A%20'%2Bsd.height)%0A%22%20value%3DcurrentStyle%3E%0A%3Ctable%3E%3Ccolgroup%3E%3Ccol%3E%3Ctbody%3E%3Ctr%3E%3Ctd%3E%3C%2Ftd%3E%3C%2Ftr%3E%3C%2Ftbody%3E%3C%2Ftable%3E;p=n;x=style-element>
[CODE(CSS)@en[[[display]]: [[table-column-group]]]]
<http://suika.fam.cx/gate/2007/cssom/viewer?c=colgroup%20%7B%0A%20%20height%3A%2010em%3B%0A%7D;h=%3Cinput%20type%3Dbutton%20onclick%3D%22%0A%20%20var%20el%20%3D%20document.getElementsByTagName%20('colgroup')%5B0%5D%3B%0A%20%20var%20sd%20%3D%20getComputedStyle%20(el%2C%20null)%3B%0A%20%20w%20('getComputedStyle%3A%3A%20display%3A%20'%2Bsd.display%2B'%2C%20height%3A%20'%2Bsd.height)%0A%22%20value%3DgetComputedStyle%3E%0A%3Cinput%20type%3Dbutton%20onclick%3D%22%0A%20%20var%20el%20%3D%20document.getElementsByTagName%20('colgroup')%5B0%5D%3B%0A%20%20var%20sd%20%3D%20el.currentStyle%3B%0A%20%20w%20('currentStyle%3A%3A%20display%3A%20'%2Bsd.display%2B'%2C%20height%3A%20'%2Bsd.height)%0A%22%20value%3DcurrentStyle%3E%0A%3Ctable%3E%3Ccolgroup%3E%3Ccol%3E%3Ctbody%3E%3Ctr%3E%3Ctd%3E%3C%2Ftd%3E%3C%2Ftr%3E%3C%2Ftbody%3E%3C%2Ftable%3E;p=n;x=style-element>
([[名無しさん]])
[67]
>>66 [CODE(CSS)@en[[[width]]]] の場合と同様、
[[WinIE 6]] は[[指定値]]、[[Firefox]] 2 は[[使用値]]を返すようです。
一方 [[Opera]] 9 は、
[CODE(DOMm)@en[[[getComputedStyle]]]] は [CODE(CSS)@en[0[[px]]]]、
[CODE(DOMa)@en[[[currentStyle]]]]] は[[指定値]]を返すようです。
[[CSS 2.1]] によればこれらの場合は [CODE(CSS)@an[[[auto]]]]
が[[算出値]]のはずです。
([[名無しさん]])
[68]
[[Firefox]] 2 は常に[[使用値]] (もしかしたら[[実際値]]) を返すようです。
([[名無しさん]])
[69]
[[包含ブロック]]の[[高さ]]が[[内容高]]に依存し、かつその[[要素]]は[[絶対位置指定]]されていないので、[[百分率値]]の[[算出値]]が [CODE(CSS)@en[[[auto]]]] となる場合
<http://suika.fam.cx/gate/2007/cssom/viewer?c=div%20%7B%0A%20%20height%3A%20auto%3B%0A%7D%0Ap%20%7B%0A%20%20position%3A%20static%3B%0A%20%20display%3A%20block%3B%0A%20%20height%3A%2010%25%3B%0A%7D;h=%3Cinput%20type%3Dbutton%20onclick%3D%22%0A%20%20var%20el%20%3D%20document.getElementsByTagName%20('p')%5B0%5D%3B%0A%20%20var%20sd%20%3D%20getComputedStyle%20(el%2C%20null)%3B%0A%20%20w%20('getComputedStyle%3A%3A%20display%3A%20'%2Bsd.display%2B'%2C%20height%3A%20'%2Bsd.height)%0A%22%20value%3DgetComputedStyle%3E%0A%3Cinput%20type%3Dbutton%20onclick%3D%22%0A%20%20var%20el%20%3D%20document.getElementsByTagName%20('p')%5B0%5D%3B%0A%20%20var%20sd%20%3D%20el.currentStyle%3B%0A%20%20w%20('currentStyle%3A%3A%20display%3A%20'%2Bsd.display%2B'%2C%20height%3A%20'%2Bsd.height)%0A%22%20value%3DcurrentStyle%3E%0A%3Cdiv%3E%3Cp%3Exxx%3C%2Fdiv%3E;p=n;x=style-element>
([[名無しさん]])
[70]
>>69
[[Firefox]] 2 は >>68。[[WinIE 6]] は[[指定値]]。[[Opera]] 9
[CODE(DOMm)@en[[[getComputedStyle]]]] は[[使用値]] (あるいは[[実際値]]?)。
[CODE(DOMa)@en[[[currentStyle]]]] は[[指定値]]。
([[名無しさん]])
[72] [CITE[Document Structure – SVG 1.1 (Second Edition)]]
( ([TIME[2011-08-10 12:35:27 +09:00]] 版))
<http://www.w3.org/TR/2011/REC-SVG11-20110816/struct.html#SVGElementHeightAttribute>
[73] [CITE[Document Structure – SVG 1.1 (Second Edition)]]
( ([TIME[2011-08-10 12:35:27 +09:00]] 版))
<http://www.w3.org/TR/2011/REC-SVG11-20110816/struct.html#UseElementHeightAttribute>
[74] [CITE[Document Structure – SVG 1.1 (Second Edition)]]
( ([TIME[2011-08-10 12:35:27 +09:00]] 版))
<http://www.w3.org/TR/2011/REC-SVG11-20110816/struct.html#ImageElementHeightAttribute>
[75] [CITE[Packaged Web Apps (Widgets) - Packaging and XML Configuration (Second Edition)]]
( ([TIME[2012-11-22 21:22:20 +09:00]] 版))
<http://w3c.github.com/packed-webapps/packaging/#the-height-attribute>
[1] [CITE[OASIS Open Document Format for Office Applications (OpenDocument) Version 1.2 - Part 1: OpenDocument Schema]]
([TIME[2011-09-29 13:00:00 +09:00]] 版)
<http://docs.oasis-open.org/office/v1.2/os/OpenDocument-v1.2-os-part1.html#a19_238fo_max-height>
[FIG(quote)[
[FIGCAPTION[
[2] [CITE@en[RFC 7749 - The "xml2rfc" Version 2 Vocabulary]]
([TIME[2016-02-04 22:54:51 +09:00]] 版)
<https://tools.ietf.org/html/rfc7749#section-2.5.3>
]FIGCAPTION]
> The suggested height of the graphics (when it was included using the
> "src" attribute).
> This attribute is format dependent and ought to be avoided.
> When generating HTML output '''['''HTML''']''', current implementations copy the
> attribute "as is", thus effectively treating it as CSS (Cascading
> Style Sheets) pixels (see Section 4.3.2 of '''['''CSS''']'''). For other output
> formats, it is usually ignored.
>
]FIG]
[5] [CITE@en[Make OffscreenCanvas resizeable]]
([[junov]]著, [TIME[2016-12-06 07:06:13 +09:00]])
<https://github.com/whatwg/html/commit/1a4bed42e68e42db712bfcea6e7505b06a589104>
[FIG(quote)[
[FIGCAPTION[
[6] [CITE@ja[Aice5]]
([TIME[2017-01-01 23:55:28 +09:00]])
<http://king-cr.jp/artist/aice5/>
]FIGCAPTION]
> <img src="images/spacer.gif" height="25px">
]FIG]
[7] [CITE@en['''['''css-tables''']''' Clarified percent heights in table-cells]]
([[FremyCompany]]著, [TIME[2017-01-10 07:14:20 +09:00]])
<https://github.com/w3c/csswg-drafts/commit/c90f12ec9bd43f25a9d65dd645df8a79655fdb02>
[8] [CITE@en[Remove <applet>]]
([[zcorpan]]著, [TIME[2017-08-21 22:19:30 +09:00]])
<https://github.com/whatwg/html/commit/b9b9d60f9451c05f8e8d542e4094f987ae1a5fb8>
[9] [CITE@en['''['''css-sizing''']''' Import full propdef tables for all sizing properties, an…]]
([[tabatkins]]著, [TIME[2017-12-05 09:40:50 +09:00]])
<https://github.com/w3c/csswg-drafts/commit/aab263247a81dce2d2c4be5e6653d46ee63e261d>
[10] [CITE@en[Editorial: add a definition for canvas width/height numeric values]]
([[GloverDonovan]]著, [TIME[2018-02-22 05:41:43 +09:00]])
<https://github.com/whatwg/html/commit/822a7bd4097af8b9a5f65ae74c4a13dd9b33e976>
[11] [CITE@en[What happens when setting the canvas width/height to an invalid value? · Issue #2066 · whatwg/html]]
([TIME[2018-02-22 15:54:34 +09:00]])
<https://github.com/whatwg/html/issues/2066>
[12] [CITE@en[Add cross-reference for obtaining numeric values by GloverDonovan · Pull Request #3475 · whatwg/html]]
([TIME[2018-02-22 15:56:01 +09:00]])
<https://github.com/whatwg/html/pull/3475>