1

クロムで楕円形のグラデーションを取得しようとしています。私はもう試した

    background-image:
    -webkit-gradient(ellipse, center top, 0, center top, 50, from(rgba(0,0,0,0)), to(rgba(0,0,0,.5))),
    -webkit-gradient(linear, 50% 100%, 50% 0%, from(#0A6B9A), to(#29ABE2));

運がない。ネットやいくつかの本で見つけた他のいくつかのことを試しましたが、すべて失敗するか、円として出てきます。

firefox で簡単に実行できます (興味のある人にとってはクールな効果です):

    background-image:
    -moz-radial-gradient(40% 0%, circle, rgba(0,0,0,0), rgba(0,0,0,.5)),
    -moz-linear-gradient(50% 100%, #0A6B9A, #29ABE2);

これはクロムで可能ですか？私が見たグラデーションの計画された仕様によれば、それは可能であるはずです。Chromeがまだサポートしていないだけかもしれません。

**編集ああ、チェックしたところ、スタイルが上書きされていないか、そのようなジャズはありません

4

1 に答える 1

1

-mozは Firefox 専用の CSS プロパティです。そのため、Chrome (および他のブラウザー) では機能しません。

より具体的には、で始まるすべての CSS プロパティ-は標準ではなく、特定のブラウザーでのみ機能します。互換性のためにのみ使用されます。ブラウザーがプロパティの意味を理解できない場合、それをスキップするだけです。そのため、CSS ファイルには複数のプロパティがあり、同じ理由-mozで-webkitどこでも機能しません (あなただけでなく)。

CSS3 互換のブラウザーの場合、W3c の慣例ではトーンにする必要があります。

background: radial-gradient(ellipse at center, rgba(30,87,153,1) 0%,rgba(41,137,216,1) 50%,rgba(32,124,202,1) 51%,rgba(125,185,232,1) 100%);

(色は異なりますので、ご注意くださいbackground: radial-gradient(ellipse ...)

これにはhttp://www.colorzilla.com/gradient-editor/またはその他の CSS グラデーション ジェネレーターを使用できます。方向を放射状に設定するだけです。

于 2013-04-05T21:23:49.080 に答える