| 1 |
|
| 2 |
|
| 3 |
* font 要素型 (HTML, XHTML 1) |
| 4 |
|
| 5 |
[4] [[HTML]] の [DFN[[CODE(HTMLe)[font]] 要素型]]の要素は、 |
| 6 |
文字の大きさや色を変更します。 |
| 7 |
|
| 8 |
[5] 仕様書: |
| 9 |
- [[HTML 4]] |
| 10 |
-- 15.2.2 Font modifier elements: [CODE(HTMLe)[FONT]] and [CODE(HTMLe)[BASEFONT]] |
| 11 |
<IW:HTML4:"present/graphics.html#edef-FONT"> |
| 12 |
|
| 13 |
[6] |
| 14 |
:[[局所名]]:[CODE(HTMLe)[font]] |
| 15 |
:[[名前空間名]]:[CODE(URI)[[[http://www.w3.org/1999/xhtml]]]] |
| 16 |
:[[開始タグ]]:必須 |
| 17 |
:[[終了タグ]]:必須 |
| 18 |
:[[内容模型]]:[CODE(SGML)[(%[[inline]];)*]] |
| 19 |
:出現できる文脈:[CODE(SGML)[%inline]] な文脈 |
| 20 |
:[[属性]]: |
| 21 |
,属性名 ,属性値 ,既定値 ,説明 ,状態 ,出典 |
| 22 |
,[CODE(HTMLa)[[[class]]]] , , ,[[級]] ,[HTML4] %[[coreattr]] |
| 23 |
,[CODE(HTMLa)[[[color]]]] ,[CODE(SGML)[%[[Color]]]] ,(継承) ,文字色 ,[HTML 4] 非推奨 |
| 24 |
,[CODE(HTMLa)[[[dir]]]] , , ,[[書字方向]] ,[HTML4] %[[i18n]] |
| 25 |
,[CODE(HTMLa)[[[effect]]]] , , ,表示効果 ,非標準 ,[[WebTV]] |
| 26 |
,[CODE(HTMLa)[[[face]]]] , ,(継承) ,書体 ,[HTML 4] 非推奨 |
| 27 |
,[CODE(HTMLa)[[[id]]]] , , ,一意識別子 ,[HTML4] %coreattr |
| 28 |
,[CODE(HTMLa)[[[lang]]]] , , ,[[自然言語]] ,[HTML4] %i18n |
| 29 |
,[CODE(HTMLa)[[[xml]]:lang]] , , ,自然言語 ,[XHTML1] |
| 30 |
,[CODE(HTMLa)[[[point-size]]]] , , ,文字の大きさ (ポイント単位) ,非標準 |
| 31 |
,[CODE(HTMLa)[[[size]]]] , ,(継承) ,文字の大きさ ,[HTML 4] 非推奨 |
| 32 |
,[CODE(HTMLa)[[[style]]]] , , ,スタイル情報 ,[HTML4] %coreattr |
| 33 |
,[CODE(HTMLa)[[[title]]]] , , ,注釈的題 ,[HTML4] %coreattr |
| 34 |
,[CODE(HTMLa)[[[weight]]]] , , ,太さ ,非標準 |
| 35 |
,[CODE(XMLa)[[[xmlns]]]] ,[CODE(URI)[[[http://www.w3.org/1999/xhtml]]]] 固定 ,[[名前空間名]] ,W3C 勧告 ,[[XHTML m12n]] |
| 36 |
|
| 37 |
|
| 38 |
[10] なぜか HTML 4 では [CODE(SGML)[%[[event]]]] 属性集合が含まれていません。 |
| 39 |
|
| 40 |
[[#comment]] |
| 41 |
|
| 42 |
|
| 43 |
** 代替 |
| 44 |
|
| 45 |
[8] この要素型は'''[RUBYB[非推奨] [deprecated]]'''です。 |
| 46 |
代わりに、[[スタイル・シート]]を利用できます。 |
| 47 |
|
| 48 |
[9] [[CSS]] なら、 [CODE(HTMLa)[face]] 属性を |
| 49 |
[SAMP(CSS)[[[font-family]]]] 特性、 [CODE(HTMLa)[color]] |
| 50 |
属性を [SAMP(CSS)[[[color]]]] 特性、 [CODE(HTMLa)[size]] |
| 51 |
属性を [SAMP(CSS)[[[font-size]]]] 特性で指定できます。 |
| 52 |
|
| 53 |
[[#comment]] |
| 54 |
|
| 55 |
|
| 56 |
** 他との関係 |
| 57 |
|
| 58 |
[7] [CODE(HTMLe)[font]] 要素を使わない時や属性を省略した時や |
| 59 |
[CODE(HTMLa)[size]] 属性で相対指定を行った時の基底 (既定) |
| 60 |
の値は、 [CODE(HTMLe)[[[basefont]]]] 要素の指定によります。 |
| 61 |
|
| 62 |
[[#comment]] |
| 63 |
|
| 64 |
|
| 65 |
** 不思議解釈 |
| 66 |
|
| 67 |
[1] 【[[HP]]】 文字を表示させるための[[タグ]]。 |
| 68 |
|
| 69 |
[2] 一説に、表示させる全ての文字列は [CODE(HTMLe)[font]] |
| 70 |
タグで囲んでおかないといけないらしい。 ([[XUL]] |
| 71 |
でどの[[箱]]にも属さないものは表示されない、みたいなもんだな。) |
| 72 |
|
| 73 |
[3] >>2 でも、当のその解説が [CODE(HTMLe)[font]] |
| 74 |
タグに囲まれていない文字列を書いていたりするが。 |
| 75 |
|
| 76 |
[[#comment]] |
| 77 |
|
| 78 |
|
| 79 |
** 歴史 |
| 80 |
|
| 81 |
[17] |
| 82 |
[CODE(HTMLe)@en[[[font]]]] [[要素]]は、[[HTML 2.0]] |
| 83 |
の拡張として [[Netscape Navigator]] が実装しました。 |
| 84 |
|
| 85 |
当初は [CODE(HTMLa)@en[[[size]]]] [[属性]]だけが定義されていました。 |
| 86 |
|
| 87 |
;; [CITE[Netscape Navigator Extensions to HTML]] |
| 88 |
<http://web.archive.org/web/20000415023954/http://www.netscape.com/home/services_docs/html-extensions.html> |
| 89 |
|
| 90 |
[18] |
| 91 |
[CITE[IRC logs: w3c / #html-wg / 20070330]] ([CODE[2007-03-31 21:23:37 +09:00]] 版) <http://krijnhoetmer.nl/irc-logs/html-wg/20070330#l-991> |
| 92 |
|
| 93 |
> # # [20:56] <Hixie> the <font> and style="" issue in HTML5 isn't even remotely decided yet |
| 94 |
> # # [20:56] <Hixie> the current text is clearly not acceptable to a majority of people and will be changing |
| 95 |
|
| 96 |
([[名無しさん]]) |
| 97 |
|
| 98 |
|
| 99 |
[39] |
| 100 |
[CITE@en[<font> and style="" in HTML5]] ([[Ian Hickson]] 著, [TIME[2008-04-29 21:21:45 +09:00]] 版) <http://lists.w3.org/Archives/Public/public-html/2008Apr/0795.html> |
| 101 |
([[名無しさん]]) |
| 102 |
|
| 103 |
|
| 104 |
[[#comment]] |
| 105 |
|
| 106 |
|
| 107 |
** メモ |
| 108 |
|
| 109 |
[[#comment]] |
| 110 |
|
| 111 |
|
| 112 |
* メモ |
| 113 |
|
| 114 |
[11] |
| 115 |
[SAMP(CSS)[font: -moz-field;]] |
| 116 |
([[名無しさん]] [sage]) |
| 117 |
|
| 118 |
[12] |
| 119 |
[SAMP(CSS)[font: medium -moz-fixed;]] |
| 120 |
([[名無しさん]] [sage]) |
| 121 |
|
| 122 |
[13] |
| 123 |
[SAMP(CSS)[font: -moz-list;]] |
| 124 |
([[名無しさん]] [sage]) |
| 125 |
|
| 126 |
[14] |
| 127 |
[SAMP(CSS)[font: -moz-button;]] |
| 128 |
([[名無しさん]] [sage]) |
| 129 |
|
| 130 |
[15] |
| 131 |
[CODE(CSS example)@en[font: [[-webkit-small-control]];]] |
| 132 |
([[名無しさん]] [sage]) |
| 133 |
|
| 134 |
[16] |
| 135 |
[CODE(CSS example)@en[font: [[-webkit-small-control]];]] |
| 136 |
([[名無しさん]] [sage]) |
| 137 |
|
| 138 |
[19] |
| 139 |
テスト用: |
| 140 |
<http://suika.fam.cx/gate/2007/cssom/viewer?c=p%20%7B%0D%0A%20%20font%3A%20menu%3B%0D%0A%7D%0D%0A%0D%0A%0D%0A;h=%3Cp%3E%3Cbutton%20type%3Dbutton%20onclick%3D%22%0D%0A%20%20var%20el%20%3D%20document.getElementsByTagName%20('p')%5B0%5D%3B%0D%0A%20%20var%20s%20%3D%20sd%20()%3B%0D%0A%20%20w%20(%5B'font'%2C%20s.font%2C%20'font-family'%2C%20s.fontFamily%2C%20'font-style'%2C%20s.fontStyle%2C%20'font-variant'%2C%20s.fontVariant%2C%20'font-weight'%2C%20s.fontWeight%2C%20'font-size'%2C%20s.fontSize%2C%20'line-height'%2C%20s.lineHeight%5D)%3B%0D%0A%22%3ECSSOM%3C%2Fbutton%3E%0D%0A%3Cbutton%20type%3Dbutton%20onclick%3D%22%0D%0A%20%20var%20el%20%3D%20document.getElementsByTagName%20('p')%5B0%5D%3B%0D%0A%20%20var%20s%20%3D%20getComputedStyle%20(el%2C%20null)%3B%0D%0A%20%20w%20(%5B'font'%2C%20s.font%2C%20'font-family'%2C%20s.fontFamily%2C%20'font-style'%2C%20s.fontStyle%2C%20'font-variant'%2C%20s.fontVariant%2C%20'font-weight'%2C%20s.fontWeight%2C%20'font-size'%2C%20s.fontSize%2C%20'line-height'%2C%20s.lineHeight%5D)%3B%0D%0A%22%3E%3Ccode%3EgetComputedStyle%3C%2Fcode%3E%3C%2Fbutton%3E%0D%0A%3Cbutton%20type%3Dbutton%20onclick%3D%22%0D%0A%20%20var%20el%20%3D%20document.getElementsByTagName%20('p')%5B0%5D%3B%0D%0A%20%20var%20s%20%3D%20el.currentStyle%3B%0D%0A%20%20w%20(%5B'font'%2C%20s.font%2C%20'font-family'%2C%20s.fontFamily%2C%20'font-style'%2C%20s.fontStyle%2C%20'font-variant'%2C%20s.fontVariant%2C%20'font-weight'%2C%20s.fontWeight%2C%20'font-size'%2C%20s.fontSize%2C%20'line-height'%2C%20s.lineHeight%5D)%3B%0D%0A%22%3E%3Ccode%3EcurrentStyle%3C%2Fcode%3E%3C%2Fbutton%3E;p=n;x=style-element> |
| 141 |
|
| 142 |
([[名無しさん]]) |
| 143 |
|
| 144 |
[20] |
| 145 |
[[WinIE 6]] の[[構文解析]]: |
| 146 |
= [[空白]]を0以上読み飛ばします。 |
| 147 |
= 次の値として[[システム・フォント]] |
| 148 |
([[ASCII]] [[大文字]]/[[小文字]][[一致]]) が指定されていれば |
| 149 |
(そしてそれ以降に[[空白]]以外何もなければ)、 |
| 150 |
それを [CODE(DOMa)@en[[[font]]]] に設定します |
| 151 |
([[escape]] は除去しますが、[[大文字]]・[[小文字]]はそのままです)。 |
| 152 |
以降の処理は行いません (関連 [[longhand]] についても何もしません)。 |
| 153 |
= まず、[CODE(CSS)@en[[[font-weight]]]], |
| 154 |
[CODE(CSS)@en[[[font-style]]]], |
| 155 |
[CODE(CSS)@en[[[font-variant]]]] の部分です。 |
| 156 |
== 3つのうちいずれか1つで ([[WinIE 6]] が) 解釈可能な値なら、 |
| 157 |
該当する[[特性]]にその値を設定します。 |
| 158 |
=== これによって3つの[[特性]]がすべて明示的に設定されれば、 |
| 159 |
次へ進みます。 |
| 160 |
=== [CODE(CSS)[[[100]]]]〜[CODE(CSS)[[[900]]]] は |
| 161 |
[CODE(CSS)@en[[[font-weight]]]] の値とみなされますが、 |
| 162 |
[[小数点]]が含まれる場合やそれ以外の [CODE(CSS)@en[<[[number]]>]] |
| 163 |
の場合には [CODE(CSS)@en[[[font-weight]]]] とはみなされません。 |
| 164 |
== [CODE(CSS)@en[[[normal]]]] なら無視します。 |
| 165 |
== それ以外の値の場合は次へ進みます。 |
| 166 |
== [[空白]]を読み飛ばし、繰り返します。ただし1つも[[空白]]がなければ構文エラーです。 |
| 167 |
= [[空白]]を読み飛ばします (これ以前になにかあったら1つ以上必要で、 |
| 168 |
なければ構文エラーです)。 |
| 169 |
= 次の値を [CODE(CSS)@en[[[font-size]]]] として解釈します。 |
| 170 |
== [[奇癖モード]]では[[単位]]なしの [CODE(CSS)@en[<[[number]]>]] |
| 171 |
は [CODE(CSS)@en[[[px]]]] [[単位]]とみなされます |
| 172 |
([[CSSOM]] に現れる値は[[単位]]補完済み)。 |
| 173 |
== 解釈できなければ構文エラーです。 |
| 174 |
= [[空白]]を0以上読み飛ばします。 |
| 175 |
= [CODE(CSS)@en[[[/]]]] があれば、 |
| 176 |
== 注意: ここで[[空白]]を読み飛ばしません ([[注釈]]は通常通り読み飛ばします)。 |
| 177 |
== [CODE(CSS)@en[[[line-height]]]] として解釈します。 |
| 178 |
=== [CODE(CSS)@en[<[[number]]>]] の場合、その直後にごみがあれば読み飛ばします。 |
| 179 |
例えば [CODE(CSS)[20em/1""s""eeearaaaaaaa""a"a"]] |
| 180 |
なら [CODE(CSS)@en[font-size: 20em; line-height: 1]] で、 |
| 181 |
それ以降の部分は読み飛ばします。 (この部分の正確な動作は不明です。) |
| 182 |
== 解釈できなければ [CODE(CSS)@en[[[line-height]]]] には何も |
| 183 |
([[初期値]]すら!) 設定しません。これは構文エラーではありません。 |
| 184 |
== [[空白]]を読み飛ばします。1つ以上なければ構文エラーです。 |
| 185 |
= 残りを [CODE(CSS)@en[[[font-family]]]] として解釈します。 |
| 186 |
解釈できなければ構文エラーです。 |
| 187 |
= 以上で設定しなかった [[longhand]] には[[初期値]]を設定します。 |
| 188 |
= ただし、構文エラーがあるときは通例通り[[宣言]]ごと[[無視]]されます。 |
| 189 |
= また、他の[[特性]]同様、[[注釈]]は値の途中だろうと無視されます。 |
| 190 |
|
| 191 |
([[名無しさん]]) |
| 192 |
|
| 193 |
[21] |
| 194 |
[[Opera]] 9 の[[構文解析]]: |
| 195 |
- おそらくほぼ [[CSS 2.1]] 通りです。 |
| 196 |
- [CODE(CSS)@en[[[font-family]]]]、 |
| 197 |
[CODE(CSS)@en[[[font-weight]]]] が[[CSSOM]] に現れる値が[[使用値]] (?) |
| 198 |
になるのは [[longhand]] のときと同じです。 |
| 199 |
- [[システム・フォント]]が指定されたときには |
| 200 |
[CODE(CSS)@en[[[font-family]]]] にその値が入ります。 |
| 201 |
他の [[longhand]] はそのままです ([[初期値]]を設定しません)。 |
| 202 |
-- なお、 [CODE(CSS)@en[[[font-family]]: [[menu]]]] や |
| 203 |
[CODE(CSS)@en[[[font]]: 1[[px]] [[menu]]]] |
| 204 |
のように [CODE(CSS)@en[<'[[font-family]]'>]] |
| 205 |
として[[システム・フォント]]を指定しようとしても、 |
| 206 |
[[システム・フォント]]ではなく、実際の[[フォント名]]として解釈しようとするらしく、 |
| 207 |
(システム上に存在しないので) [[空文字列]]になります。 |
| 208 |
- [[無奇癖モード]]、[[奇癖モード]]とも、 |
| 209 |
[CODE(CSS)@en[[[font-size]]]] として |
| 210 |
[CODE(CSS)@en[<[[number]]>]] を指定できません ([CODE(CSS)[[[0]]]] |
| 211 |
も駄目です)。 |
| 212 |
- [CODE(CSS)@en[[[font-weight]]]] で [CODE(CSS)[[[100]]]] [[以上]] |
| 213 |
[CODE(CSS)[[[900]]]] [[以下]]のどんな値も指定できるのは |
| 214 |
[[longhand]] と同じ。 |
| 215 |
|
| 216 |
([[名無しさん]]) |
| 217 |
|
| 218 |
[22] |
| 219 |
>>21 [CODE(CSS)@en[[[font-weight]]]] で [[CSSOM]] |
| 220 |
に現れる値は[[使用値]]ではなく、指定されている値を丸めたものですが、 |
| 221 |
なぜか 100 の倍数だと 100 少ない値になるようです。 |
| 222 |
[CODE(CSS)[[[100]]]] のときは [CODE(CSS)[[[400]]]] になります。 |
| 223 |
|
| 224 |
;; <http://suika.fam.cx/gate/2007/cssom/viewer?c=p%20%7B%0D%0A%20%20font%3A%20900%201em%20serif%3B%0D%0A%7D;h=%3Cp%3E%3Cbutton%20type%3Dbutton%20onclick%3D%22%0D%0A%20%20var%20el%20%3D%20document.getElementsByTagName%20('p')%5B0%5D%3B%0D%0A%20%20var%20s%20%3D%20sd%20()%3B%0D%0A%20%20w%20(%5B'font'%2C%20s.font%2C%20'font-family'%2C%20s.fontFamily%2C%20'font-style'%2C%20s.fontStyle%2C%20'font-variant'%2C%20s.fontVariant%2C%20'font-weight'%2C%20s.fontWeight%2C%20'font-size'%2C%20s.fontSize%2C%20'line-height'%2C%20s.lineHeight%5D)%3B%0D%0A%22%3ECSSOM%3C%2Fbutton%3E%0D%0A%3Cbutton%20type%3Dbutton%20onclick%3D%22%0D%0A%20%20var%20el%20%3D%20document.getElementsByTagName%20('p')%5B0%5D%3B%0D%0A%20%20var%20s%20%3D%20getComputedStyle%20(el%2C%20null)%3B%0D%0A%20%20w%20(%5B'font'%2C%20s.font%2C%20'font-family'%2C%20s.fontFamily%2C%20'font-style'%2C%20s.fontStyle%2C%20'font-variant'%2C%20s.fontVariant%2C%20'font-weight'%2C%20s.fontWeight%2C%20'font-size'%2C%20s.fontSize%2C%20'line-height'%2C%20s.lineHeight%5D)%3B%0D%0A%22%3E%3Ccode%3EgetComputedStyle%3C%2Fcode%3E%3C%2Fbutton%3E%0D%0A%3Cbutton%20type%3Dbutton%20onclick%3D%22%0D%0A%20%20var%20el%20%3D%20document.getElementsByTagName%20('p')%5B0%5D%3B%0D%0A%20%20var%20s%20%3D%20el.currentStyle%3B%0D%0A%20%20w%20(%5B'font'%2C%20s.font%2C%20'font-family'%2C%20s.fontFamily%2C%20'font-style'%2C%20s.fontStyle%2C%20'font-variant'%2C%20s.fontVariant%2C%20'font-weight'%2C%20s.fontWeight%2C%20'font-size'%2C%20s.fontSize%2C%20'line-height'%2C%20s.lineHeight%5D)%3B%0D%0A%22%3E%3Ccode%3EcurrentStyle%3C%2Fcode%3E%3C%2Fbutton%3E;p=n;x=style-element> は [CODE(CSS)[[[900]]]] のはずがなぜか |
| 225 |
[CODE(CSS)[[[800]]]]。 |
| 226 |
|
| 227 |
また、 [CODE(CSS)@en[[[font]]: 1[[em]] [[serif]]]] |
| 228 |
のような[[共通族名]]は[[使用値]] (?) に置き換えられます。 |
| 229 |
[CODE(CSS)@en[[[font-family]]: [[serif]]]] |
| 230 |
と [[longhand]] で指定したときはそのままなのに。 |
| 231 |
([[名無しさん]]) |
| 232 |
|
| 233 |
[23] |
| 234 |
[[Firefox]] 2: |
| 235 |
- ほぼ [[CSS 2.1]] 通りのようです。 |
| 236 |
- [CODE(CSS)@en[[[small-caps]] [[normal]] <'[[font-weight]]'> (以下略)]] |
| 237 |
はなぜか[[宣言]]ごと[[無視]]されます (順序を入れ替えたり、 |
| 238 |
他の値の組み合わせにしたりしても[[無視]]されませんが、 |
| 239 |
なぜかこれだけ)。 |
| 240 |
;; <http://suika.fam.cx/gate/2007/cssom/viewer?c=p%20%7B%0A%20%20font%3A%20small-caps%20normal%20bolder%201em%20serif%3B%0A%7D%0A;h=%3Cp%3E%3Cbutton%20type%3Dbutton%20onclick%3D%22%0A%20%20var%20el%20%3D%20document.getElementsByTagName%20('p')%5B0%5D%3B%0A%20%20var%20s%20%3D%20sd%20()%3B%0A%20%20w%20(%5B'font'%2C%20s.font%2C%20'font-family'%2C%20s.fontFamily%2C%20'font-style'%2C%20s.fontStyle%2C%20'font-variant'%2C%20s.fontVariant%2C%20'font-weight'%2C%20s.fontWeight%2C%20'font-size'%2C%20s.fontSize%2C%20'line-height'%2C%20s.lineHeight%5D)%3B%0A%22%3ECSSOM%3C%2Fbutton%3E%0A%3Cbutton%20type%3Dbutton%20onclick%3D%22%0A%20%20var%20el%20%3D%20document.getElementsByTagName%20('p')%5B0%5D%3B%0A%20%20var%20s%20%3D%20getComputedStyle%20(el%2C%20null)%3B%0A%20%20w%20(%5B'font'%2C%20s.font%2C%20'font-family'%2C%20s.fontFamily%2C%20'font-style'%2C%20s.fontStyle%2C%20'font-variant'%2C%20s.fontVariant%2C%20'font-weight'%2C%20s.fontWeight%2C%20'font-size'%2C%20s.fontSize%2C%20'line-height'%2C%20s.lineHeight%5D)%3B%0A%22%3E%3Ccode%3EgetComputedStyle%3C%2Fcode%3E%3C%2Fbutton%3E%0A%3Cbutton%20type%3Dbutton%20onclick%3D%22%0A%20%20var%20el%20%3D%20document.getElementsByTagName%20('p')%5B0%5D%3B%0A%20%20var%20s%20%3D%20el.currentStyle%3B%0A%20%20w%20(%5B'font'%2C%20s.font%2C%20'font-family'%2C%20s.fontFamily%2C%20'font-style'%2C%20s.fontStyle%2C%20'font-variant'%2C%20s.fontVariant%2C%20'font-weight'%2C%20s.fontWeight%2C%20'font-size'%2C%20s.fontSize%2C%20'line-height'%2C%20s.lineHeight%5D)%3B%0A%22%3E%3Ccode%3EcurrentStyle%3C%2Fcode%3E%3C%2Fbutton%3E;p=n;x=style-element> |
| 241 |
- [[奇癖モード]]では [CODE(CSS)@en[<'[[font-size]]'>]] |
| 242 |
の[[単位]]がないと [CODE(CSS)@en[[[px]]]] が補完されますが、 |
| 243 |
[CODE(CSS)[[[100]]]]〜[CODE(CSS)[[[900]]]] の100の[[倍数]]で、 |
| 244 |
かつ[[小数点]]が入っていない値 ([[先導0]]おk) は |
| 245 |
[CODE(CSS)@en[<'[[font-weight]]'>]] とみなされますので、 |
| 246 |
[CODE(CSS)@en[[[font]]: 100 serif]] のような[[宣言]]は[[無視]]されます。 |
| 247 |
- [[WinIE 6]] や [[Opera]] 9 とは異なり、 [[CSS 2]] にあって |
| 248 |
[[CSS 2.1]] にない [CODE(CSS)@en[[[font-size-adjust]]]] や |
| 249 |
[CODE(CSS)@en[[[font-stretch]]]] も[[初期値]]にします。 |
| 250 |
- [[システム・フォント]]が指定された場合、 |
| 251 |
[CODE(CSS)@en[[[font-family]]]] にその値 ([[ASCII]] |
| 252 |
[[小文字]]、[[escape]] 除去済み) が設定されます。 |
| 253 |
それ以外の [[longhand]] には[[空文字列]]が設定されます。 |
| 254 |
-- [CODE(CSS)@en[[[font-family]]]] に直接[[システム・フォント]]名を指定しても、 |
| 255 |
その名前の[[フォント]]を探すだけで、[[システム・フォント]]とは解釈されないようです。 |
| 256 |
|
| 257 |
([[名無しさん]]) |
| 258 |
|
| 259 |
[24] |
| 260 |
[[DOM属性]] [CODE(DOMa)@en[[[font]]]]: |
| 261 |
- [[Opera]] 9 |
| 262 |
-- ([[初期値]]だろうと) 値が指定されているもの ([[算出値]]の場合は全部) |
| 263 |
を全部書き出します。 |
| 264 |
-- 最初の3つは [CODE(CSS)@en[[[font-style]]]]、 |
| 265 |
[CODE(CSS)@en[[[font-variant]]]]、 |
| 266 |
[CODE(CSS)@en[[[font-weight]]]] の順。 |
| 267 |
-- [CODE(CSS)@en[[[font-size]]]] の値が与えられていないと、 |
| 268 |
その前の[[空白]]と |
| 269 |
後ろの [CODE(CSS)@en[[[/]]]] も含めてなくなってしまいます |
| 270 |
([CODE(CSS)@en[[[font-size]]]] の値がない時点で[[非妥当]])。 |
| 271 |
-- [CODE(CSS)@en[[[line-height]]]] の値が与えられていないと、 |
| 272 |
その前の [CODE(CSS)[[[/]]]] がなくなるのはよいとして、 |
| 273 |
その後ろの ([CODE(CSS)@en[[[font-family]]]] の前の) |
| 274 |
[[空白]]までなくなってしまいます。 |
| 275 |
-- [CODE(CSS)@en[[[font-family]]]] が指定されていないと、 |
| 276 |
その前の[[空白]]も含めてなくなってしまいます |
| 277 |
([CODE(CSS)@en[[[font-family]]]] 部がないのは[[非妥当]])。 |
| 278 |
-- 従ってどの [[longhand]] もなければ[[空文字列]]になります。 |
| 279 |
-- それぞれの値は [[longhand]] に対応する [[DOM属性]]の値のようです |
| 280 |
(例えば [CODE(DOMa)@en[[[currentStyle]]]] や |
| 281 |
[CODE(DOMm)@en[[[getComputedStyle]]]] のとき |
| 282 |
[CODE(CSS)@en[[[font-family]]]] は[[使用値]]、 |
| 283 |
[CODE(CSS)@en[[[bolder]]]] を指定したら普通のは |
| 284 |
[CODE(CSS)@en[[[bolder]]]]、 |
| 285 |
[CODE(DOMa)@en[[[currentStyle]]]] は |
| 286 |
[CODE(CSS)@en[[[bold]]]]、 |
| 287 |
[CODE(DOMm)@en[[[getComputedStyle]]]] は |
| 288 |
[CODE(CSS)@en[[[700]]]])。 |
| 289 |
-- [CODE(CSS)@en[[[font-family]]]] の値が実は[[システム・フォント]]だとしても気にしない。 |
| 290 |
|
| 291 |
([[名無しさん]]) |
| 292 |
|
| 293 |
[25] |
| 294 |
>>24 |
| 295 |
[[Firefox]] 2 |
| 296 |
- ([[初期値]]だろうと) 値が与えられているものを書くのは >>24 と同じ。 |
| 297 |
- 順序も >>24 と同じ。 |
| 298 |
- [CODE(CSS)@en[[[font-size]]]] と [CODE(CSS)@en[[[font-family]]]] |
| 299 |
が最低限指定されていないと[[空文字列]]になる。 |
| 300 |
- [CODE(CSS)@en[[[font-family]]]] の値が実は[[システム・フォント]]だとしても気にしない。 |
| 301 |
- [CODE(DOMm)@en[[[getComputedStyle]]]] では常に[[空文字列]]。 |
| 302 |
|
| 303 |
([[名無しさん]]) |
| 304 |
|
| 305 |
[26] |
| 306 |
>>24 [[WinIE 6]] |
| 307 |
- 5[[特性]]すべてに値が与えられていない限り、[[空文字列]]。 |
| 308 |
- [[初期値]]以外の値なら現れる。 |
| 309 |
[CODE(CSS)@en[[[font-size]]]] と [CODE(CSS)@en[[[font-family]]]] |
| 310 |
は常に現れる。 |
| 311 |
- 順序は [CODE(CSS)@en[[[font-weight]]]]、 |
| 312 |
[CODE(CSS)@en[[[font-style]]]]、 |
| 313 |
[CODE(CSS)@en[[[font-variant]]]]。 |
| 314 |
- [CODE(DOMa)@en[[[currentStyle]]]] には存在しない |
| 315 |
([CODE(JS)@en[[[undefined]]]])。 |
| 316 |
- 各値を [CODE(charname)@en[[[SPACE]]]] 1つで区切る。 |
| 317 |
([CODE(CSS)@en[[[font-size]]]]と[CODE(CSS)@en[[[line-height]]]] |
| 318 |
の間は [CODE(CSS)[[[/]]]] 1つ。) |
| 319 |
|
| 320 |
([[名無しさん]]) |
| 321 |
|
| 322 |
[27] |
| 323 |
全体的にどのブラウザもどこかがおかしいですが、 |
| 324 |
そのなかで一番まともそうに見えるのが [[WinIE 6]] |
| 325 |
だという稀有な例です。 |
| 326 |
([[名無しさん]]) |
| 327 |
|
| 328 |
[28] |
| 329 |
やっぱり >>27 は取り消し ([[構文解析]]のあれはひどいだろう)。 |
| 330 |
([[名無しさん]]) |
| 331 |
|
| 332 |
[29] |
| 333 |
[[longhand]] は[[カスケーディング]]の前に [[shorthand]] |
| 334 |
に分解する (最低でも分解したかのように扱う) 必要があるのですが、 |
| 335 |
[[システム・フォント]]が指定されるとそういうわけにもいかなくなります。 |
| 336 |
内部的な特殊な値で ([CODE(CSS example)@en[font-family: -x-menu-font-family; font-size: -x-menu-font-size]] のように) |
| 337 |
扱うとしても、[[算出値]]の算出時に実際の値に置換する必要があります |
| 338 |
([CODE(CSS)@en[[[font-size]]]] は [CODE(CSS)@en[[[em]]]] |
| 339 |
の基準になるので)。 |
| 340 |
([[名無しさん]]) |
| 341 |
|
| 342 |
[30] |
| 343 |
[[システム・フォント]]が指定されたら [[longhand]] はすべて[[空文字列]]になるらしい (ただし [[should]])。 |
| 344 |
|
| 345 |
;; |
| 346 |
<http://www.w3.org/TR/2000/REC-DOM-Level-2-Style-20001113/css.html#CSS-CSS2Properties> |
| 347 |
|
| 348 |
どのブラウザも違うけど、 [[Firefox]] 2 が一番近いか。 |
| 349 |
|
| 350 |
([[名無しさん]]) |
| 351 |
|
| 352 |
[31] |
| 353 |
[CODE(CSS)@en[<'[[font-family]]'>]] が [CODE(CSS)@en[[[inherit]]]] |
| 354 |
: |
| 355 |
<http://suika.fam.cx/gate/2007/cssom/viewer?c=p%20%7B%0A%20%20font%3A%2016px%20inherit%3B%0A%7D%0A;h=;p=n;x=style-element;i=html-div> |
| 356 |
|
| 357 |
([[名無しさん]]) |
| 358 |
|
| 359 |
[32] |
| 360 |
[CODE(CSS)@en[<'[[font-weight]]'>]] が省略された時の値は |
| 361 |
[[Opera]] 9 では [CODE(CSS)[[[400]]]]、[[WinIE 6]] と |
| 362 |
[[Firefox]] 2 では [CODE(CSS)@en[[[normal]]]] です。 |
| 363 |
([[名無しさん]]) |
| 364 |
|
| 365 |
[33] |
| 366 |
>>31 [[Firefox]] 2 は[[宣言]]ごと[[無視]]しますが、 |
| 367 |
[[Opera]] 9 では (そういう[[フォント]]はないので) |
| 368 |
[CODE(CSS)@en[[[font-family]]]] を[[空文字列]]にします。 |
| 369 |
([[名無しさん]]) |
| 370 |
|
| 371 |
[34] |
| 372 |
>>31 |
| 373 |
|
| 374 |
後に別の[[フォント名]] |
| 375 |
<http://suika.fam.cx/gate/2007/cssom/viewer?c=p%20%7B%0A%20%20font%3A%2016px%20inherit%2C%20a%3B%0A%7D%0A;h=;p=n;x=style-element;i=html-div> |
| 376 |
|
| 377 |
結果は >>33 と同じ。 |
| 378 |
|
| 379 |
前に別の[[フォント名]] |
| 380 |
<http://suika.fam.cx/gate/2007/cssom/viewer?c=p%20%7B%0A%20%20font%3A%2016px%20a%2C%20inherit%3B%0A%7D%0A;h=;p=n;x=style-element;i=html-div> |
| 381 |
|
| 382 |
[[Firefox]] 2 は[[無視]]しなくなります。 [[Opera]] 9 は >>33 と同じ。 |
| 383 |
([[名無しさん]]) |
| 384 |
|
| 385 |
[35] |
| 386 |
[[Opera]] 9 も [[WinIE 6]] も [CODE(CSS)@en[[[font-stretch]]]] |
| 387 |
や [CODE(CSS)@en[[[font-size-adjust]]]] には対応していないようなので、 |
| 388 |
[[Firefox]] 2 や [[CSS 2]] との不整合はありません。 |
| 389 |
([[名無しさん]]) |
| 390 |
|
| 391 |
[36] |
| 392 |
>>35 訂正、[[Opera]] 9 は [CODE(CSS)@en[[[font-size-adjust]]]] |
| 393 |
を実装しています。なので、 |
| 394 |
[PRE(CSS example code)[ |
| 395 |
p { |
| 396 |
font-size-adjust: 3; |
| 397 |
font: 12px serif; |
| 398 |
} |
| 399 |
]PRE] |
| 400 |
|
| 401 |
は [[Firefox]] と [[Opera]] で違った結果になります。 |
| 402 |
|
| 403 |
;; なお、 [[Opera]] は [CODE(CSS)@en[[[font-size-adjust]]]] |
| 404 |
を実際に[[レンダリング]]に使っているのか不明。 |
| 405 |
|
| 406 |
([[名無しさん]]) |
| 407 |
|
| 408 |
[37] |
| 409 |
[[Firefox]] 2 の [CODE(DOMa)@en[[[font]]]] |
| 410 |
[[DOM属性]]は、 |
| 411 |
[CODE(CSS)@en[[[font-size-adjust]]]] や |
| 412 |
[CODE(CSS)@en[[[font-stretch]]]] と無関係に値を返すようです。 |
| 413 |
([[名無しさん]]) |
| 414 |
|
| 415 |
[38] |
| 416 |
[[CSS 2]] は [CODE(CSS)@en[[[font]]]] に [CODE(CSS)@en[[[inherit]]]] |
| 417 |
を指定したら |
| 418 |
[CODE(CSS)@en[[[font-size-adjust]]]] や |
| 419 |
[CODE(CSS)@en[[[font-stretch]]]] |
| 420 |
がどうなるのか明記していませんが、 |
| 421 |
[[Firefox]] 2 は [CODE(CSS)@en[[[inherit]]]] を設定します。 |
| 422 |
|
| 423 |
([[名無しさん]]) |
Parent Directory
| 
Revision Log