スタイル属性モジュール

Edit New

style 属性

[25] HTML のほとんどの要素型で定義されている style 属性は、その要素のスタイル情報を指定します。

[12] style 属性は、ほとんどの HTML, SVG, MathML, XUL, i-XHTML 要素にあって、 その要素に適用するスタイル指定を値に持ちます。

代替

[95] style 属性は、制作中の便宜、あるいは例外的なスタイルの指定を目的としたものであり、 一般的には、代わりに style 要素や外部スタイル・シートを使って指定すること望ましいと考えられています。

仕様書

意味

[97] MathML では、style 属性は XSLT や CSS と共に使うためのスタイル情報を要素に関連付けるものとされています。 この情報は典型的には CSS 行内スタイルですが、MathML ではそれを規定しない、 とされています。 >>96

属性値

データ型

[13] この属性の値は、 %StyleSheet です。 SGML 的には CDATA です。 適当なスタイル言語によって解釈されます。

[98] MathML におけるデータ型は string で >>96、 >>97 の通りそれ以上の制約は課されていません。

既定値

[27] この属性は省略可能です。省略された場合、特にスタイルの指定はないものとされます。

属性値のスタイル言語

[28] HTML 4 では、 既定スタイル言語 (Content-Style-Type: 欄の説明を参照。) の構文に従って指定します。

ただし、多くの HTML UA は CSS (text/css) に決め打ちしています。

[29] SVG では、 svg 要素の contentStyleType 属性で指定した言語になります。

[30] MathML, XUL では CSS で固定です。 i-XHTML では i-CSS です。

[31] XSL のような XML 系スタイル言語を使うことって可能なのでしょうかね?

CSS

[36] CSS2 の場合、 style 属性値として指定するのは括弧無しの宣言ブロック構文 (declaration block syntax) です。 (という一文が HTML 4.01 で一例として追加されました。 HTML 4.0 ではこの種の説明が一切ありませんでした。)

CSS 側には一切規定がありません (だから HTML 4.01 で慌てて追加したのでしょう)。 構文を拡張する WD [CSSATTR] が古くから提案されていますが、 CSS3 にあわせて勧告になるのか、ならないのか。

実装

[32] HTML 4 では style 属性を使う時は CST の指定が必須なわけですが、 Gecko は確かに Content-Style-Type が無指定または text/css 以外だと無視してくれました。 しかし WinIE 6 は遠慮なく適用します。 (名無しさん 2004-03-23 06:16:14 +00:00)

[33] >>32 無指定のときは既定値の text/css となるべき (should) だから [HTML 4] 、よくないんじゃないか?

[35] >>32 の無指定のときの結果は間違いかも。

他との関係

[23] HTML 4 では、 style 属性を使用する時は必ず Content-Style-Type の指定が必要です。

[37] 複数の要素にスタイルを指定するためには、 style 要素を使用するべきです。更に、柔軟性のために外部スタイル・シートを使用するべきです。 [HTML 4]

歴史

[40] draft-ietf-html-style-00, https://datatracker.ietf.org/doc/html/draft-ietf-html-style-00

[39] draft-ietf-html-style-01, https://datatracker.ietf.org/doc/html/draft-ietf-html-style-01

[19] HTML DTD with support for Style Sheets http://www.w3.org/TR/NOTE-html-970421.html (HTML 3.2 + Style Sheet) はほとんどの要素型に style 属性を定義しています。

[57] W3C Chat before XTech 2000: XHTML - a bridge to the Web of the future (Dan Connolly 著, 2000-02-21 12:36:22 +09:00 版) http://lists.w3.org/Archives/Public/www-html/2000Feb/0203.html

IRC log from 2000-02-25T08:07-0500 (2000-02-26 00:53:02 +09:00 版) http://www.w3.org/2000/02/25-xhtml-irc (名無しさん)

[58] >>57 style を削除しようかという議論をしているが特に面白いことはなかった。何か結論を出そうとしているのでもない。 (名無しさん)

[59] inline CSS - score so far (JOrendorff@ixl.com 著, 2000-02-23 17:52:57 +09:00 版) http://lists.w3.org/Archives/Public/www-html/2000Feb/0317.html

HTML4

HTML 以外

[65] DTBook にも HTML4 から移入されました。

代替

[16] XHTML 1.1 ではこの属性は非推奨とされています。

[94] MathML 2.0 でもこの属性は非推奨とされています 要出典。

[106] XHTML m12n には Style Attribute Module として含まれていますが、特に非推奨とは書かれていません。

[107] XHTML+RDFa 1.1 は Style Attribute Module を非推奨としています。

XHTML2

[86] XHTML2 には最初含まれていませんでしたが、第5次案でなぜか 「強く非推奨 (strongly discouraged) 」としながらも復活しました。

HTML5

[21] font

[38] [] (0) <font> is gone; style= is global.]], Hixie, , https://github.com/whatwg/html/commit/bd2c20622f8b7f19bf1fe1faa7e83abfaf8607e2#diff-41cf6794ba4200b839c53531555f0f3998df4cbb01a4d5cb0b94e3ca5e23947d

css-style-attr

[100] CSS WG による css-style-attr は、 Webブラウザーに実装されていなかった拡張をすべて削り、 HTML4/CSS2 で規定されていた機能だけ規定した状態でようやく2013年11月にW3C勧告となりました。

[101] しかし CSS2 以前の古いスタイルの規定になっていて、勧告となった時点で既に時代遅れという、 W3C の Process の問題点そのものでしかない仕様書となっています。

[105] PR となった後 ED (>>102) には@規則を構文上認める拡張がなされており、 そういう意味でも勧告となった時点で既に勧告は古くて使いものにならなくなっています。

例

[34] CSS を使用した例

<P style="font-size: 12pt; color: fuchsia">Aren't style sheets wonderful?

(HTML 4 仕様書より)

[24] UA が CST を正しく扱っているかのテスト: http://suika.fam.cx/~wakaba/-temp/test/html/style/

メモ

[14] style 属性はある特定の要素の表現を制御するのに便利ですが、表現と構造を分離することを考えるとあまり得策ではありません。 (例えば、一つの文書に複数のスタイル・シートを適用させることを考えると、文書そのものにスタイル指定があるのは有害です。) その問題を理解した上で使う (永続的なスタイルの指定とか。) のであれば問題はないでしょうが、そうでなければ i-XHTML/i-CSS のような “TagSoup の CSS 版” にしかならない諸刃の剣です。

[11] XHTML 2.0 では採用されない予定です。

[17] 2003-05-10 08:36 >>11: こんどの WD で復活

[15] さて CSS を値に使う場合の書式は、 HTML 4 も CSS 1 も CSS 2 もその他の規格も、例示で簡単に説明している程度で、 はっきりとは定義していません。現在 WD である [CSSATTR] は、 現在の書式を更に柔軟な指定が可能に拡張したものを定義しています。

CSS 以外のスタイル言語で style 属性の値として使う方法を規定したものがあるのかは不明です。

[22] >>15 text/jss で可能 (JIS X 4052:2000 5.4.2 を参照。)

[50] 公開メモ日記 - JavaScriptによって事後に要素に埋め込む、style属性によるインラインスタイルシートは、これを肯定する (2007-02-24 02:17:48 +09:00 版) http://knoa.jp/memo/?id=2007-02-19+12:00 (名無しさん 2007-02-23 17:20:53 +00:00)

[51] 公開メモ日記 - JavaScriptによって事後に要素に埋め込む、style属性によるインラインスタイルシートは、これを肯定する (2007-02-24 02:17:48 +09:00 版) http://knoa.jp/memo/?id=2007-02-19+12:00 (名無しさん 2007-02-23 17:21:12 +00:00)

[53] text:wrap has style.

[54] HTML5 IRC logs: freenode / #whatwg / 20070503 (2007-05-04 21:12:45 +09:00 版) http://krijnhoetmer.nl/irc-logs/whatwg/20070503#l-431 (名無しさん 2007-05-04 12:13:34 +00:00)

[55] >>54

03:31 <Hixie> othermaciej: the current spec is a failed experiment

(名無しさん)

[56]

03:31 <othermaciej> Hixie: I'm not sure removing style="", allowing it on <font> for WYSIWYG only, and adding scoped <style> addresses any actual requirements

(名無しさん)

[60] Opera 9 も Firefox 2 も、 setAttribute で HTML の style 属性を変更すると勝手に属性値を正規化するようです (cssText と同じ?)。 (名無しさん)

[61] >>60 Opera 9 で CSS として非妥当な値を与えた場合、 ; が1つでも含まれていれば (その前後が妥当な宣言であろうとなかろうと) 無視するみたいです (元の style 属性値のまま変わりません)。含まれていなければ、 属性値は空文字列になるようです。

http://suika.fam.cx/~wakaba/-temp/test/dom/element/set-attr/html/style/ (名無しさん)

[62] >>61 空文字列ではなく null かもしれないがよくわからない。 (名無しさん)

[74] We don't need the style attribute (Ian Hickson 著, 2003-01-16 21:19:27 +09:00 版) http://lists.w3.org/Archives/Public/www-html/2003Jan/0277.html (名無しさん)

[76]

style="color: green;
}
color: red;"

http://suika.fam.cx/gate/2007/cssom/viewer.en.html?c=color%3A%20green%3B%0A%7D%0Acolor%3A%20red%3B%0A%0A;h=XXXXXXXXXX;p=n;x=style-attribute;i=html-div

WinIE 7 では赤色、それ以外3ブラウザでは緑色。 (名無しさん)

[77] >>60 Safari 3.1 の動作は正しいです (cssText は正規化済み、 getAttribute は元のまま。)

Opera は 9.27 の時は cssText の動作が正しく (正規化済み)、 getAttribute の動作が間違っていました (これも正規化済み) が、 9.52 では逆になっていて、 cssText の動作は誤り (元のまま)、 getAttribute の動作は正しい (元のまま) ようです。 (名無しさん)

[78] >>77 Opera 9.52 で CSSStyleDeclaration 上の属性を変更すると、 cssText や style 内容属性の値は空文字列になるようです。

http://suika.fam.cx/gate/2007/cssom/viewer.en.html?c=p%7B%0D%0Acolor%3A%20reD%3B%0D%0A%7D%3Bt%3B%0D%0Acolor%3A%20green%3B%0D%0Aunknown%20%3B%0D%0A%7D;h=%3Cspan%20onclick%3D%22sd().color%3D'blue'%3Bw(typeof%20(sd().cssText))%3Bu()%3B%22%3EXXXXXXXXXX;p=n;x=svg-style-attribute;i=html-div

(名無しさん)

[79] >>78 は間違いなので訂正。

変更すると、

(名無しさん)

[80] >>77 Opera 9.52 は SVG の style 属性についてはどちらも正しい。 (名無しさん)

[81] >>79 どうも、 Opera 9.52 の SVG の style 属性に対応する cssText は、単に任意の文字列を読み書きできるだけのオブジェクト特性 (初期値は空文字列) になっているようです。 実際のスタイル特性の変化に追随しませんし、値を設定してもスタイル特性には影響しません。 (名無しさん)

[82] >>81 他方、 HTML の style 属性に対応する cssText は、style 属性を文字列として反映しているだけのようです。 値を設定しても、文字列として内容属性が変化し、それに追随してスタイル特性も変化しますが、 cssText の値は内容属性と同じです。 スタイル特性が変更されるとそれに追随して内容属性も変化しますが、 cssText も同じ値に変化します。(なお、 スタイル特性を変更したものの、実際には値に変化が起こらない場合 (同じ値を代入した場合など) には内容属性も cssText も変化しないみたいです。) (名無しさん)

[83]

style="color: red;
};
color: green;"

http://suika.fam.cx/gate/2007/cssom/viewer.en.html?c=color%3A%20red%3B%0A%7D%3B%0Acolor%3A%20green%3B;h=XXXXXXXXXX;p=n;x=style-attribute;i=html-div

Firefox 3 と WinIE 7 では緑色 (正しい)。 Safari 3.1 と Opera 9.52 では赤色 (間違い)。 (名無しさん)

[84] >>83 } を }{} とか }{ とかに変えてみても結果は変わらず。 Safari と Opera では一度 } が現れると後はすべて無視されるのか? (名無しさん)

メモ

[85] WebKit は Attr オブジェクトにもなぜか style DOM属性があります。、

[87] IRC logs: freenode / #whatwg / 20090528 ( 版) http://krijnhoetmer.nl/irc-logs/whatwg/20090528#l-455

[88] IRC logs: freenode / #whatwg / 20090625 ( 版) http://krijnhoetmer.nl/irc-logs/whatwg/20090625#l-658

[89] CSS Styling Attributes Level 1 ( 版) http://www.w3.org/TR/2010/WD-css-style-attr-20100121/

[90] HTML5 Revision Tracker ( 版) http://html5.org/tools/web-apps-tracker?from=4875&to=4876

[91] 

<p style="border: 3px solid blue" style="color: red">FAIL if text color is red

http://software.hixie.ch/utilities/js/live-dom-viewer/?%3Cp%20style%3D%22border%3A%203px%20solid%20blue%22%20style%3D%22color%3A%20red%22%3EFAIL%20if%20text%20color%20is%20red

[92] >>91 In IE8's IE7 and quirks modes text is red; In IE8 mode text is black.

[93] CSS Style Attributes ( ( 版)) http://www.w3.org/TR/2010/CR-css-style-attr-20101012/

[108] OMDoc の多くの要素にも CSS を指定する style 属性があります。

[1] Point to CSS Style Attribute spec for style="" attribute parsing. · w3c/svgwg@8140455 ( 版) https://github.com/w3c/svgwg/commit/81404552b1ad77f1b0594233d7735a7afb89a82c

[2] Typo: 'style-src' should govern 'style-attribute'. · w3c/webappsec-csp@96f37a9 ( 版) https://github.com/w3c/webappsec-csp/commit/96f37a90276126cb2ad5dbe845585dc3655473ce

[3] Close #384: add CSP hooks to handle inline events and style · whatwg/html@920c918 ( 版) https://github.com/whatwg/html/commit/920c9183a7990968ecac1aeedae22391f3438791

[4] Close #384: add CSP hooks to handle inline events and style · whatwg/html@920c918 ( 版) https://github.com/whatwg/html/commit/920c9183a7990968ecac1aeedae22391f3438791

[5] Editorial: Add cross-spec links for more CSS-related terms · whatwg/html@1d2fb5a ( 版) https://github.com/whatwg/html/commit/1d2fb5a5ad913b35a9906769f6d7fad06f38edad

[6] Add the 'unsafe-hash-attributes' source expression. · w3c/webappsec-csp@a2bb43f ( 版) https://github.com/w3c/webappsec-csp/commit/a2bb43f407949a860f027a97e232c755b51029ab

[7] Add a source argument to CSP's inline behavior algorithm · whatwg/html@e0863d9 ( 版) https://github.com/whatwg/html/commit/e0863d93ec8c0b48f1c44d8d81a409eb08dee28c

[8] Is the style attribute of an element removed when its associated property declaration block becomes empty? · Issue #2306 · whatwg/html () https://github.com/whatwg/html/issues/2306

[9] update CSS text to also talk about presentational hints (jeisinger著, ) https://github.com/w3c/webappsec-referrer-policy/commit/618cdccbf455dae16dc5b5085db87711574e7843

[10] [cssom]Inline style manipulation is somewhere between underspecified and incorrectly specified · Issue #1559 · w3c/csswg-drafts () https://github.com/w3c/csswg-drafts/issues/1559

[18] [cssom-1] Ensure inline style and corresponding declaration block updates each other properly by upsuper · Pull Request #2269 · w3c/csswg-drafts () https://github.com/w3c/csswg-drafts/pull/2269

[20] [cssom-1] Record mutation for changes to CSSStyleDeclaration. by upsuper · Pull Request #2268 · w3c/csswg-drafts () https://github.com/w3c/csswg-drafts/pull/2268

Updated: