CSS 編集
GeckoによるCSSの実装状況をまとめます。
CSSとは 編集
構造とスタイルを分離するために作られたもので、スタイルを定義するためのものです。
対応状況 編集
Acid2 編集
CSSへの対応度テスト。Geckoは既にオリジナルのAcid
はクリアしている。Acid2の方はFirefox 3.0(Gecko 1.9)の開発版で既にクリアしている。
- Acid2
- Acid2スクリーンショット集
- Geckoのバージョンによる違い
CSS 2 編集
| 名前 | Gecko 1.7 | Gecko 1.8 | Gecko 1.9 |
| 5.セレクタ | |||
| * | ○ | ○ | ○ |
| E | ○ | ○ | ○ |
| E F | ○ | ○ | ○ |
| E > F | ○ | ○ | ○ |
| E:first-child | ○ | ○ | ○ |
| E:link | ○ | ○ | ○ |
| E:visited | ○ | ○ | ○ |
| E:active | ○ | ○ | ○ |
| E:hover | ○ | ○ | ○ |
| E:focus | ○ | ○ | ○ |
| E:lang(c) | ○ | ○ | ○ |
| E + F | ○ | ○ | ○ |
| E[foo] | ○ | ○ | ○ |
| E[foo="warning"] | ○ | ○ | ○ |
| E[foo~="warning"] | ○ | ○ | ○ |
| E[lang｜="en"] | ○ | ○ | ○ |
| DIV.warning | ○ | ○ | ○ |
| E#myid | ○ | ○ | ○ |
| :first-line | ○ | ○ | ○ |
| :first-letter | ○ | ○ | ○ |
| 6.プロパティ値の割り当て、カスケード処理、および継承 | |||
| @import | ○ | ○ | ○ |
| !important | ○ | ○ | ○ |
| 7.メディアタイプ | |||
| @media | ○ | ○ | ○ |
| 8.ボックスモデル | |||
| margin-top | ○ | ○ | ○ |
| margin-right | ○ | ○ | ○ |
| margin-bottom | ○ | ○ | ○ |
| margin-left | ○ | ○ | ○ |
| margin | ○ | ○ | ○ |
| padding-top | ○ | ○ | ○ |
| padding-right | ○ | ○ | ○ |
| padding-bottom | ○ | ○ | ○ |
| padding-left | ○ | ○ | ○ |
| padding | ○ | ○ | ○ |
| border-top-width | ○ | ○ | ○ |
| border-right-width | ○ | ○ | ○ |
| border-bottom-width | ○ | ○ | ○ |
| border-left-width | ○ | ○ | ○ |
| border-width | ○ | ○ | ○ |
| border-top-color | ○ | ○ | ○ |
| border-right-color | ○ | ○ | ○ |
| border-bottom-color | ○ | ○ | ○ |
| border-left-color | ○ | ○ | ○ |
| border-color | ○ | ○ | ○ |
| border-top-style | ○ | ○ | ○ |
| border-right-style | ○ | ○ | ○ |
| border-bottom-style | ○ | ○ | ○ |
| border-left-style | ○ | ○ | ○ |
| border-style | ○ | ○ | ○ |
| border-top | ○ | ○ | ○ |
| border-right | ○ | ○ | ○ |
| border-bottom | ○ | ○ | ○ |
| border-left | ○ | ○ | ○ |
| border | ○ | ○ | ○ |
| 9.視覚フォーマットモデル | |||
| display | △(run-in(bug 2056)/compact(bug 180468)に非対応。CSS2.1からCSS3に移される予定?) | △(run-in(bug 2056)/compact(bug 180468)に非対応。CSS2.1からCSS3に移される予定?) | △(run-in(bug 2056)/compact(bug 180468)に非対応。CSS2.1からCSS3に移される予定?) |
| position | ○ | ○ | ○ |
| top | ○ | ○ | ○ |
| right | ○ | ○ | ○ |
| bottom | ○ | ○ | ○ |
| left | ○ | ○ | ○ |
| float | ○ | ○ | ○ |
| clear | ○ | ○ | ○ |
| z-index | ○ | ○ | ○ |
| direction | ○ | ○ | ○ |
| unicode-bidi | ○ | ○ | ○ |
| 10.視覚フォーマットモデル詳細 | |||
| width | ○ | ○ | ○ |
| min-width | ○ | ○ | ○ |
| max-width | ○ | ○ | ○ |
| height | ○ | ○ | ○ |
| min-height | ○ | ○ | ○ |
| max-height | ○ | ○ | ○ |
| line-height | ○ | ○ | ○ |
| vertical-align | ○ | ○ | ○ |
| 11.視覚エフェクト | |||
| overflow | ○ | ○ | ○ |
| clip | ○*1 | ○*2 | ○*3 |
| visibility | ○ | ○ | ○ |
| 12.内容生成と自動番号付けとリスト | |||
| :before | ○ | ○ | ○ |
| :after | ○ | ○ | ○ |
| content | ○ | ○ | ○ |
| quotes | △(二つ以上の指定不可) | ○ | ○ |
| marker-offset | ○ | ○ | ○ |
| list-style-type | ○*4 | ○*5 | ○*6 |
| list-style-image | ○ | ○ | ○ |
| list-style-position | ○ | ○ | ○ |
| list-style | ○ | ○ | ○ |
| 13.ページ化されたメディア | |||
| @page | × | × | ×(bug 115199(古いパッチあり),bug 286443) |
| size | × | × | × |
| marks | × | × | × |
| @page :left | × | × | × |
| @page :right | × | × | × |
| @page :first | × | × | × |
| page-break-before | ○ | ○ | ○ |
| page-break-after | ○ | ○ | ○ |
| page-break-inside | × | × | ×(bug 132035) |
| page | × | × | × |
| orphans | × | × | × |
| widows | × | × | × |
| 14.色と背景 | |||
| color | ○ | ○ | ○ |
| background-color | ○ | ○ | ○ |
| background-image | ○ | ○ | ○ |
| background-repeat | ○ | ○ | ○ |
| background-attachment | ○ | ○ | ○ |
| background-position | ○ | ○ | ○ |
| background | ○ | ○ | ○ |
| 15.フォント | |||
| font-family | ○ | ○ | ○ |
| font-style | ○ | ○ | ○ |
| font-variant | ○ | ○ | ○ |
| font-weight | ○ | ○ | ○ |
| font-stretch | × | × | × |
| font-size | ○ | ○ | ○ |
| font-size-adjust | ○ | ○ | ○ |
| font | ○ | ○ | ○ |
| @font-face | × | × | × |
| 16.テキスト | |||
| text-indent | ○ | ○ | ○ |
| text-align | △(Tableの揃える文字列に未対応(bug 2212)) | △(Tableの揃える文字列に未対応(bug 2212)) | △(Tableの揃える文字列に未対応(bug 2212)) |
| text-decoration | ○ | ○ | ○ |
| text-shadow*7 | × | × | ×(bug 10713) |
| letter-spacing | ○ | ○ | ○ |
| text-transform | ○ | ○ | ○ |
| white-space | ○ | ○ | ○ |
| 17.テーブル | |||
| table-layout | ○ | ○ | ○ |
| empty-cells | ○ | ○ | ○ |
| speak-header | × | × | × |
| 18.UI | |||
| cursor | △(<uri>が指定不可能) | ○ | ○ |
| outline | ×(-moz-outlineはあるものの実装が仕様と異なる) | ○ | ○ |
| 19.音声のスタイルシート | |||
| volume | × | × | × |
| speak | × | × | × |
| pause-before | × | × | × |
| pause-after | × | × | × |
| pause | × | × | × |
| cue-before | × | × | × |
| cue-after | × | × | × |
| cue | × | × | × |
| play-during | × | × | × |
| azimuth | × | × | × |
| elevation | × | × | × |
| speech-rate | × | × | × |
| voice-family | × | × | × |
| pitch | × | × | × |
| pitch-range | × | × | × |
| stress | × | × | × |
| richness | × | × | × |
| speak-punctuation | × | × | × |
| speak-numeral | × | × | × |
CSS 3 編集
CSS 3はまだ正式な規格ではありませんがGeckoは幾つか先行実装しています。
motohiko氏によるまとめやCSS Test Page等を参照。
SVG関連のCSS 編集
SVGの対応状況を参照。
*バグ 編集
- 単位が無いfont-sizeを無視する(Gecko1.9では修正されている)
- 単位emとexが未実装
独自拡張のCSS 編集
XUL用独自拡張CSSを参照。
参考 編集
- コメント -- by お名前 at 2006年11月02日 (木) 03時04分42秒
- コメント -- by お名前 at 2006年06月13日 (火) 18時53分20秒