Mozillaスタイルシート実装状況テストページ

CSS, level 1

border-style: dotted

Thebeでのborderコード書き直しの一環(Bug 368247)として、dottedが四角のドットから丸のドットへ変更された。

サンプルソース


<div style="border: dotted 10px blue; width: 20em;">
枠線が丸いドットで表現されているか、角の処理は上手くいっているか。
</div>

サンプル表示

枠線が丸いドットで表現されているか、角の処理は上手くいっているか。

CSS, level 2

display: inline-block | inline-table

2007-01-28 ようやっとサポートされた。

outline:

outlineの問題点。背景が灰色のときinvartの値がうまく設定されない。テーブルやフォーム部品に対して動的にoutlineの設定が行えるか、など。現時点でほぼ解消されているけど、念のため残しておく。(2005-08-07)

2007年3月以降、Trunkにおいてoutlineプロパティからinvert値がサポートされなくなりました。(Cairoの制限による, Bug 335394)

サンプル表示

Outline invert white.

Outline invert red.

Outline invert blue.

Outline invert magenta.

Outline invert 50%.

legend
Table Caption
Table HeaderTable Header
Table DataTable Data
Table DataTable Data

content: <counter>

カウンタの実装はまだ不明な点が残る、Bugzillaで言及された仕様の改訂状況も要チェック。

サンプル表示

CSS, level 3

::selection (::-moz-selection)

文字列を選択したときの文字色・背景色の反転方法を指定するもの。デフォルトの色と、セレクタで指定できる色を検証する。

サンプル表示

選択されたテキストのスタイルを設定する疑似要素。

::selectionが設定されていない場合の選択色はどうなっているのかの実験。

::selectionが設定されていない場合の選択色はどうなっているのかの実験。

::selectionが設定されていない場合の選択色はどうなっているのかの実験。

border-radius: (-moz-border-radius)

Borderの角を丸める。Mozillaに古くから実装され、Webでもたまに使われていたりする。

Web Coreでも実装された模様。Mozillaでは値が一つしか設定できず、従って円の指定しか出来ないが、Web Coreでは値が二つ指定でき(WD仕様)従って楕円の指定が可能との話。

サンプル表示

全方位。

上の左。

上の右。

下の左。

下の右。

column-count, column-width, column-gap (-moz-column-count, -moz-column-width, -moz-column-gap, ::-moz-column-content)

マルチカラムレイアウトの実装。(2007-01-21) -moz-column-gap: normal;追加。normal = 1em

サンプル表示

二段組を指定、間隔は1emを指定。段幅を自動的に計算させる。画面の幅を変えるなどして、レンダリングの状態を確認する。 乾,元、亨、利、貞。初九,潛龍,勿用。九二,見龍在田,利見大人。九三,君子終日乾乾,夕惕若,厲,无咎。九四,或躍在淵,无咎。九五,飛龍在天,利見大人。上九,亢龍,有悔。用九,見羣龍无首,吉。The quick brown fox jumps over the lazy dog.いろはにほへとちりぬるをわかよたれそつねならむうゐのおくやまけふこえてあさきゆめみしゑひもせす

段幅15em、間隔は1emを指定。段組数を自動的に計算させる。画面の幅を変えるなどして、レンダリングの状態を確認する。 乾,元、亨、利、貞。初九,潛龍,勿用。九二,見龍在田,利見大人。九三,君子終日乾乾,夕惕若,厲,无咎。九四,或躍在淵,无咎。九五,飛龍在天,利見大人。上九,亢龍,有悔。用九,見羣龍无首,吉。The quick brown fox jumps over the lazy dog.いろはにほへとちりぬるをわかよたれそつねならむうゐのおくやまけふこえてあさきゆめみしゑひもせす

Vendor Specific CSS

-moz-border-top-colors, -moz-border-right-colors, -moz-border-bottom-colors, -moz-border-left-colors

Borderを塗り分ける。border-radiusと併用すると…?Bug 141715

サンプル表示

-moz-outline-radius

Borderと同じように、outlineも丸めることができる。 Bug 24676

サンプル表示

全方位。

上の左。

上の右。

下の左。

下の右。

Title

説明文。

サンプル表示

Propaty(プロパティ)

UI Selectors

2005-11-26時点でサポートされているのは:valid, :invalid, :in-range, :out-of-range, :required, :optional, さらに:-moz-read-only, :-moz-read-write がサポートされています。

サンプルソース

<style type="text/css">
</style>

<div style="border: solid 1px blue; width: 40em;">
</div>

サンプル表示

default

checkbox checkbox

radio radio

disabled="disabled"

checkbox checkbox

radio radio

readonly="readonly"

checkbox checkbox

radio radio

readonly="readonly" & disabled="disabled"

checkbox checkbox

radio radio

表示結果

準備中

[CSS3 Lists]list-style-type List Keyword

    -moz-arabic-indic
  1. 1 a
  2. 2 b
  3. 3 c
  4. 4 d
  5. 5 e
  6. 6 f
  7. 7 g
  8. 8 h
  9. 9 i
  10. 10 j
  11. 11 k
  12. 12 l
  13. 13 m
  14. 20 n
  15. 30 o
  16. 50 p
  17. 100 q
  18. 1000 r
  19. 0 s
  20. -1 t
    -moz-bengali
  1. 1 a
  2. 2 b
  3. 3 c
  4. 4 d
  5. 5 e
  6. 6 f
  7. 7 g
  8. 8 h
  9. 9 i
  10. 10 j
  11. 11 k
  12. 12 l
  13. 13 m
  14. 20 n
  15. 30 o
  16. 50 p
  17. 100 q
  18. 1000 r
  19. 0 s
  20. -1 t
    -moz-cjk-earthly-branch
  1. 1 a
  2. 2 b
  3. 3 c
  4. 4 d
  5. 5 e
  6. 6 f
  7. 7 g
  8. 8 h
  9. 9 i
  10. 10 j
  11. 11 k
  12. 12 l
  13. 13 m
  14. 20 n
  15. 30 o
  16. 50 p
  17. 100 q
  18. 1000 r
  19. 0 s
  20. -1 t
    -moz-cjk-heavenly-stem
  1. 1 a
  2. 2 b
  3. 3 c
  4. 4 d
  5. 5 e
  6. 6 f
  7. 7 g
  8. 8 h
  9. 9 i
  10. 10 j
  11. 11 k
  12. 12 l
  13. 13 m
  14. 20 n
  15. 30 o
  16. 50 p
  17. 100 q
  18. 1000 r
  19. 0 s
  20. -1 t
    -moz-devanagari
  1. 1 a
  2. 2 b
  3. 3 c
  4. 4 d
  5. 5 e
  6. 6 f
  7. 7 g
  8. 8 h
  9. 9 i
  10. 10 j
  11. 11 k
  12. 12 l
  13. 13 m
  14. 20 n
  15. 30 o
  16. 50 p
  17. 100 q
  18. 1000 r
  19. 0 s
  20. -1 t
    -moz-ethiopic-halehame
  1. 1 a
  2. 2 b
  3. 3 c
  4. 4 d
  5. 5 e
  6. 6 f
  7. 7 g
  8. 8 h
  9. 9 i
  10. 10 j
  11. 11 k
  12. 12 l
  13. 13 m
  14. 20 n
  15. 30 o
  16. 50 p
  17. 100 q
  18. 1000 r
  19. 0 s
  20. -1 t
    -moz-ethiopic-numeric
  1. 1 a
  2. 2 b
  3. 3 c
  4. 4 d
  5. 5 e
  6. 6 f
  7. 7 g
  8. 8 h
  9. 9 i
  10. 10 j
  11. 11 k
  12. 12 l
  13. 13 m
  14. 20 n
  15. 30 o
  16. 50 p
  17. 100 q
  18. 1000 r
  19. 0 s
  20. -1 t
    -moz-ethiopic-halehame-am
  1. 1 a
  2. 2 b
  3. 3 c
  4. 4 d
  5. 5 e
  6. 6 f
  7. 7 g
  8. 8 h
  9. 9 i
  10. 10 j
  11. 11 k
  12. 12 l
  13. 13 m
  14. 20 n
  15. 30 o
  16. 50 p
  17. 100 q
  18. 1000 r
  19. 0 s
  20. -1 t
    -moz-ethiopic-halehame-ti-er
  1. 1 a
  2. 2 b
  3. 3 c
  4. 4 d
  5. 5 e
  6. 6 f
  7. 7 g
  8. 8 h
  9. 9 i
  10. 10 j
  11. 11 k
  12. 12 l
  13. 13 m
  14. 20 n
  15. 30 o
  16. 50 p
  17. 100 q
  18. 1000 r
  19. 0 s
  20. -1 t
    -moz-ethiopic-halehame-ti-et
  1. 1 a
  2. 2 b
  3. 3 c
  4. 4 d
  5. 5 e
  6. 6 f
  7. 7 g
  8. 8 h
  9. 9 i
  10. 10 j
  11. 11 k
  12. 12 l
  13. 13 m
  14. 20 n
  15. 30 o
  16. 50 p
  17. 100 q
  18. 1000 r
  19. 0 s
  20. -1 t
    -moz-gujarati
  1. 1 a
  2. 2 b
  3. 3 c
  4. 4 d
  5. 5 e
  6. 6 f
  7. 7 g
  8. 8 h
  9. 9 i
  10. 10 j
  11. 11 k
  12. 12 l
  13. 13 m
  14. 20 n
  15. 30 o
  16. 50 p
  17. 100 q
  18. 1000 r
  19. 0 s
  20. -1 t
    -moz-gurmukhi
  1. 1 a
  2. 2 b
  3. 3 c
  4. 4 d
  5. 5 e
  6. 6 f
  7. 7 g
  8. 8 h
  9. 9 i
  10. 10 j
  11. 11 k
  12. 12 l
  13. 13 m
  14. 20 n
  15. 30 o
  16. 50 p
  17. 100 q
  18. 1000 r
  19. 0 s
  20. -1 t
    -moz-hangul-consonant
  1. 1 a
  2. 2 b
  3. 3 c
  4. 4 d
  5. 5 e
  6. 6 f
  7. 7 g
  8. 8 h
  9. 9 i
  10. 10 j
  11. 11 k
  12. 12 l
  13. 13 m
  14. 20 n
  15. 30 o
  16. 50 p
  17. 100 q
  18. 1000 r
  19. 0 s
  20. -1 t
    -moz-hangul
  1. 1 a
  2. 2 b
  3. 3 c
  4. 4 d
  5. 5 e
  6. 6 f
  7. 7 g
  8. 8 h
  9. 9 i
  10. 10 j
  11. 11 k
  12. 12 l
  13. 13 m
  14. 20 n
  15. 30 o
  16. 50 p
  17. 100 q
  18. 1000 r
  19. 0 s
  20. -1 t
    -moz-japanese-formal
  1. 1 a
  2. 2 b
  3. 3 c
  4. 4 d
  5. 5 e
  6. 6 f
  7. 7 g
  8. 8 h
  9. 9 i
  10. 10 j
  11. 11 k
  12. 12 l
  13. 13 m
  14. 20 n
  15. 30 o
  16. 50 p
  17. 100 q
  18. 1000 r
  19. 0 s
  20. -1 t
    -moz-japanese-informal
  1. 1 a
  2. 2 b
  3. 3 c
  4. 4 d
  5. 5 e
  6. 6 f
  7. 7 g
  8. 8 h
  9. 9 i
  10. 10 j
  11. 11 k
  12. 12 l
  13. 13 m
  14. 20 n
  15. 30 o
  16. 50 p
  17. 100 q
  18. 1000 r
  19. 0 s
  20. -1 t
    -moz-kannada
  1. 1 a
  2. 2 b
  3. 3 c
  4. 4 d
  5. 5 e
  6. 6 f
  7. 7 g
  8. 8 h
  9. 9 i
  10. 10 j
  11. 11 k
  12. 12 l
  13. 13 m
  14. 20 n
  15. 30 o
  16. 50 p
  17. 100 q
  18. 1000 r
  19. 0 s
  20. -1 t
    -moz-khmer
  1. 1 a
  2. 2 b
  3. 3 c
  4. 4 d
  5. 5 e
  6. 6 f
  7. 7 g
  8. 8 h
  9. 9 i
  10. 10 j
  11. 11 k
  12. 12 l
  13. 13 m
  14. 20 n
  15. 30 o
  16. 50 p
  17. 100 q
  18. 1000 r
  19. 0 s
  20. -1 t
    -moz-lao
  1. 1 a
  2. 2 b
  3. 3 c
  4. 4 d
  5. 5 e
  6. 6 f
  7. 7 g
  8. 8 h
  9. 9 i
  10. 10 j
  11. 11 k
  12. 12 l
  13. 13 m
  14. 20 n
  15. 30 o
  16. 50 p
  17. 100 q
  18. 1000 r
  19. 0 s
  20. -1 t
    -moz-malayalam
  1. 1 a
  2. 2 b
  3. 3 c
  4. 4 d
  5. 5 e
  6. 6 f
  7. 7 g
  8. 8 h
  9. 9 i
  10. 10 j
  11. 11 k
  12. 12 l
  13. 13 m
  14. 20 n
  15. 30 o
  16. 50 p
  17. 100 q
  18. 1000 r
  19. 0 s
  20. -1 t
    -moz-myanmar
  1. 1 a
  2. 2 b
  3. 3 c
  4. 4 d
  5. 5 e
  6. 6 f
  7. 7 g
  8. 8 h
  9. 9 i
  10. 10 j
  11. 11 k
  12. 12 l
  13. 13 m
  14. 20 n
  15. 30 o
  16. 50 p
  17. 100 q
  18. 1000 r
  19. 0 s
  20. -1 t
    -moz-oriya
  1. 1 a
  2. 2 b
  3. 3 c
  4. 4 d
  5. 5 e
  6. 6 f
  7. 7 g
  8. 8 h
  9. 9 i
  10. 10 j
  11. 11 k
  12. 12 l
  13. 13 m
  14. 20 n
  15. 30 o
  16. 50 p
  17. 100 q
  18. 1000 r
  19. 0 s
  20. -1 t
    -moz-persian
  1. 1 a
  2. 2 b
  3. 3 c
  4. 4 d
  5. 5 e
  6. 6 f
  7. 7 g
  8. 8 h
  9. 9 i
  10. 10 j
  11. 11 k
  12. 12 l
  13. 13 m
  14. 20 n
  15. 30 o
  16. 50 p
  17. 100 q
  18. 1000 r
  19. 0 s
  20. -1 t
    -moz-simp-chinese-formal
  1. 1 a
  2. 2 b
  3. 3 c
  4. 4 d
  5. 5 e
  6. 6 f
  7. 7 g
  8. 8 h
  9. 9 i
  10. 10 j
  11. 11 k
  12. 12 l
  13. 13 m
  14. 20 n
  15. 30 o
  16. 50 p
  17. 100 q
  18. 1000 r
  19. 0 s
  20. -1 t
    -moz-simp-chinese-informal
  1. 1 a
  2. 2 b
  3. 3 c
  4. 4 d
  5. 5 e
  6. 6 f
  7. 7 g
  8. 8 h
  9. 9 i
  10. 10 j
  11. 11 k
  12. 12 l
  13. 13 m
  14. 20 n
  15. 30 o
  16. 50 p
  17. 100 q
  18. 1000 r
  19. 0 s
  20. -1 t
    -moz-tamil
  1. 1 a
  2. 2 b
  3. 3 c
  4. 4 d
  5. 5 e
  6. 6 f
  7. 7 g
  8. 8 h
  9. 9 i
  10. 10 j
  11. 11 k
  12. 12 l
  13. 13 m
  14. 20 n
  15. 30 o
  16. 50 p
  17. 100 q
  18. 1000 r
  19. 0 s
  20. -1 t
    -moz-telugu
  1. 1 a
  2. 2 b
  3. 3 c
  4. 4 d
  5. 5 e
  6. 6 f
  7. 7 g
  8. 8 h
  9. 9 i
  10. 10 j
  11. 11 k
  12. 12 l
  13. 13 m
  14. 20 n
  15. 30 o
  16. 50 p
  17. 100 q
  18. 1000 r
  19. 0 s
  20. -1 t
    -moz-thai
  1. 1 a
  2. 2 b
  3. 3 c
  4. 4 d
  5. 5 e
  6. 6 f
  7. 7 g
  8. 8 h
  9. 9 i
  10. 10 j
  11. 11 k
  12. 12 l
  13. 13 m
  14. 20 n
  15. 30 o
  16. 50 p
  17. 100 q
  18. 1000 r
  19. 0 s
  20. -1 t
    -moz-trad-chinese-formal
  1. 1 a
  2. 2 b
  3. 3 c
  4. 4 d
  5. 5 e
  6. 6 f
  7. 7 g
  8. 8 h
  9. 9 i
  10. 10 j
  11. 11 k
  12. 12 l
  13. 13 m
  14. 20 n
  15. 30 o
  16. 50 p
  17. 100 q
  18. 1000 r
  19. 0 s
  20. -1 t
    -moz-trad-chinese-informal
  1. 1 a
  2. 2 b
  3. 3 c
  4. 4 d
  5. 5 e
  6. 6 f
  7. 7 g
  8. 8 h
  9. 9 i
  10. 10 j
  11. 11 k
  12. 12 l
  13. 13 m
  14. 20 n
  15. 30 o
  16. 50 p
  17. 100 q
  18. 1000 r
  19. 0 s
  20. -1 t
    -moz-urdu
  1. 1 a
  2. 2 b
  3. 3 c
  4. 4 d
  5. 5 e
  6. 6 f
  7. 7 g
  8. 8 h
  9. 9 i
  10. 10 j
  11. 11 k
  12. 12 l
  13. 13 m
  14. 20 n
  15. 30 o
  16. 50 p
  17. 100 q
  18. 1000 r
  19. 0 s
  20. -1 t

:-moz-alt-text, :-moz-placeholder, :-moz-broken

W3C CSS

Title

説明文。

サンプル表示

作成:2004-05-29