3

のブラウザ実装は、アンカー値としてとのlinear-gradient()両方をサポートするように進化しました。それらは同じ方向ですか、それとも反対ですか?topto top

4

2 に答える 2

4

それらは相反するものです。 to top要素の下部でtop最初の色引数を使用し、上部で最初の色引数を使用します。

ここにフィドルがあります。MDN には完全な詳細と履歴があります。

于 2013-10-21T05:13:27.727 に答える
3

それらは同じ方向ではありません。それらは正反対です。

to topは「ボトム・トゥ・トップ」の略で、「上topから始める」という意味です。1top rightこれは反対側だけでなく、やなどのコーナーにも当てはまりますbottom left

両方の方向性キーワード構文は、CSS Images レベル 3 モジュールで文書化されていました。これが、非常に多くの実装が早い段階でレガシー構文を使用した理由です。従来の構文を利用した最後の公開草案はこちらです。そのあたりのまったくのあいまいさを認める注記を見ることができ、最終的toにその後の改訂でキーワードを使用することにつながりました. 最新版はこちらです。

一部のブラウザーは、ベンダー固有の関数で線形グラデーションの方向を示すために両方の構文をサポートしていますが、標準化された関数はキーワードを含む新しい構文のみを受け入れる-*-linear-gradient()ことに注意してください。(ブラウザーがプレフィックスなしの関数で両方の構文を受け入れる場合、それは時代遅れであるか、仕様に違反しているため、報告する必要があります。)linear-gradient()to

topデフォルトの方向は、従来の構文とto bottom現在の構文に対するものであることにも注意してください。これは、デフォルトの方向が同じで、変更されていないことを意味します。

また、言及する価値があるのは、-prefix-freeを使用する場合、この変更がすでに考慮されていることです。ただし、両方の構文を別々の宣言に含める必要があるという小さな注意事項があります。

両方のバージョンを含めると、カスケードはその役割を果たし、後者のバージョンがサポートされていない場合は無視します。

background: linear-gradient(top, white, black);
background: linear-gradient(to bottom, white, black);

両方のステートメントは、プレフィックスを必要とするブラウザーでのみプレフィックスが付けられますが、それにもかかわらず、ブラウザーはカスケードを使用してどちらを使用できるかを判断します。


1 キーワードがあれば、 andは同等です。fromtopfrom top

于 2013-10-21T06:58:27.997 に答える