2017-02-24 2 views
1

0.15sのトランジションで表示される微妙なボックスシャドウを生成するには、次のCSSがあります。クロスブラウザー対応ボックスシャドー(トランジションあり)

#product { 
    -webkit-transition: box-shadow 0.15s; 
    -moz-transition: box-shadow 0.15s; 
    -ms-transition: box-shadow 0.15s; 
    -o-transition: box-shadow 0.15s; 
    transition: box-shadow 0.15s; 
    border-collapse: separate; 
} 

#product:hover { 
    -webkit-box-shadow: 0px 0px 14px 0px #C3C3C3; 
    -moz-box-shadow: 0px 0px 14px 0px #C3C3C3; 
    box-shadow: 0px 0px 14px 0px #C3C3C3; 
} 

私の質問はこれです - 0.15sの移行は、ボックスシャドウのベンダー接頭辞バージョンをピックアップし、ブラウザに適用されますか?

私ははこのように「すべて」への移行を適用したくない

transition: all 0.15s 

どのように私は、ブラウザ間で一貫性のある動作を保証するのですか?

+0

'ボックスshadow'は2010年以来の周りされている、クロスブラウザ、接頭辞、そう必要はありませんプレフィックスを使用するには – LGSon

答えて

1

ブラウザベンダーは実験的または非標準的なCSSプロパティにプレフィックスを追加することがあるため、開発者は実験を行うことができますが、ブラウザの動作の変更によって標準プロセス中にコードが破損することはありません。開発者は、ブラウザの動作が標準化されるまで、固定されていないプロパティを含めるのを待つ必要があります。

通常、ベンダーはこれらの接頭辞を使用します。

-webkit-(クローム、サファリ、オペラの新しいバージョン。)の

-moz-(Firefoxの)

-O-(旧バージョンオペラ)

-ms-(インターネットエクスプローラ)

ベンダーもAPIにプレフィックスを使用します。インターフェイスでは、彼らは一般的に使用します。

のWebkit(クローム、サファリ、オペラの新しいバージョン)

MOZ(Firefoxの)

O(オペラの旧バージョン)

MS(インターネットエクスプローラを)プロパティおよびメソッドの

、それらは典型的に使用します。

のWebKit(クロム、サファリ、オペラの新しいバージョン)を

MOZ(Firefoxの)

O(オペラの旧バージョン)

MS(インターネットエクスプローラ)

+0

申し訳ありませんが、これは私の質問には答えません – Amit

関連する問題