のブラウザ実装は、アンカー値としてとのlinear-gradient()
両方をサポートするように進化しました。それらは同じ方向ですか、それとも反対ですか?top
to top
2 に答える
それらは同じ方向ではありません。それらは正反対です。
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は同等です。from
top
from top