次の属性はブラウザとあまり互換性がありません。
1.transform:rotate(45deg)
2.border-top-left-radius この属性を使用すると、要素に丸い境界線を追加できます
3.border-radius このプロパティを使用すると、要素に丸い境界線を追加できます
4.box-shadow プロパティはボックスに 1 つ以上の影を追加します
5.text-shadow プロパティはテキストに影を設定します
6.transition
さまざまなブラウザとの互換性を高めるために、
-o- /*Opera ブラウザ*/
-webkit- /*Webkit を追加する必要があります。カーネル ブラウザ Safari および chrome*/
-ms- /*IE 9*/
-moz- /*Firefox*/
1.transform:rotate(45deg)
transform 属性を使用してオブジェクトを回転します。(45deg) は回転角度です。
transform:rotate(45deg);
-ms-transform:rotate(45deg); */
-o-transform:rotate(45deg); /*Opera ブラウザ*/
-webkit-transform:rotate(45deg); /*Webkit カーネル ブラウザ Safari および chrome*/
-moz-変換:rotate(45deg); /*Firefox ブラウザ*/
2.border-top-left-radius border-radius このプロパティを使用すると、要素に丸い境界線を追加できます
前 丸い境界線を追加する場所を選択できます
border-top-left-radius、border-top-right-radius、border-bottom-left-radius、border-bottom-right-radius
border -top-left -radius この属性を使用すると、要素に丸い境界線を追加できます。これは border-radius と同じですが、丸い境界線を追加する必要がある場所を制御できます。 3. box-shadow 属性は 1 つまたは複数のシャドウを追加し、text-shadow 属性はシャドウをテキストに設定します。 inset;
属性: 水平方向のシャドウ位置|| 垂直方向のシャドウの位置|| 外側のシャドウ (アウトセット) を内側のシャドウに変更します。 ;
テキストシャドウ: h-shadow || ブラー || テキストシャドウ: 0px -1px #000; .transition
property || タイミング関数 || 遅延
トランジション効果を完了するまでにかかる秒数またはミリ秒数を指定します。 || 速度効果の速度曲線を指定します|| トランジション効果を定義します
現在、すべてのブラウザはトランジション属性をサポートしていません。
デフォルトを緩和します。アニメーションは低速で開始され、その後速度が上がり、終了する前に減速します。
イーズイン アニメーションは低速で開始され、終了します。
イーズアウト アニメーションは低速で終了します。インアウトアニメーションは低速で開始および終了します
トランジション:背景 5 秒の容易さ
ONE EG:
コードをコピーします
コードは次のようになります:
マウス ポインタを青い div 要素に移動すると、トランジション効果が表示されます。
注: この例は Internet Explorer では動作しません。
