Chrome でマウスを置くと画像が移動するのはなぜですか?

Chrome のホバー時の画像の動き: 不透明度の問題の解決

http://www の Web ページで特有の問題が確認されました。 lonewulf.eu、ホバー時の画像の動きを含む。この現象は Chrome に限定されているため、基礎となる CSS の調査が必要です。

提供された CSS には、画像の透明度のレベルを示す複数の不透明度宣言が含まれています。ただし、ホバー状態がアクティブになると、画像はわずかに右にシフトします。

この視覚的アーティファクトに対する潜在的な解決策の 1 つは、不透明度を制御するホバー要素に次のプロパティを組み込むことです:

<code class="css">-webkit-backface-visibility: hidden;</code>

背面の可視性は、変換操作の対象となる要素の動作に関係します。ホバリング時に画像が移動するため、このプロパティにより、そのような意図しない移動が防止されます。 Webkit プレフィックスは、Chrome などの WebKit エンジンに基づく Web ブラウザにのみ適用されます。

背面の可視性とその影響についての包括的な理解については、http://css- にある CSS-Tricks ドキュメントを参照してください。 Tricks.com/almanac/properties/b/backface-visibility/.

以上がChrome でマウスを置くと画像が移動するのはなぜですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。