テーブル行のボックス シャドウの動作がブラウザごとに異なるのはなぜですか?

ブラウザ間でテーブル行のボックス シャドウの表示に一貫性がない

テーブル行 () に適用される CSS ボックス シャドウが一貫性を示さない場合があるさまざまなブラウザ間での動作。 CSS が同一であっても、ブラウザによっては意図したとおりに影が表示される場合とそうでない場合があります。

この問題を解決するには、transform プロパティを box-shadow 属性と組み合わせて使用​​することをお勧めします。変換プロパティにscale(1,1) を追加すると、ブラウザは要素を強制的に再レン​​ダリングし、ボックスシャドウ効果が確実に均一に適用されるようにします。

更新された CSS コードは次のとおりです:

tr:hover {
  transform: scale(1,1);
  -webkit-transform: scale(1,1);
  -moz-transform: scale(1,1);
  box-shadow: 0px 0px 5px rgba(0,0,0,0.3);
  -webkit-box-shadow: 0px 0px 5px rgba(0,0,0,0.3);
  -moz-box-shadow: 0px 0px 5px rgba(0,0,0,0.3);
}

このコード スニペットを追加すると、サポートされているブラウザ間でボックス シャドウが一貫して表示されるようになります。

以上がテーブル行のボックス シャドウの動作がブラウザごとに異なるのはなぜですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。