重新访问表行时跨浏览器的 Box Shadow 不一致
尽管努力实现跨浏览器兼容性,
这个神秘的问题源于不同浏览器在表行上渲染框阴影时的固有怪癖。为了解决这个异常问题,一个违反直觉的解决方案出现了。
利用变换来触发阴影外观
通过引入一个简单的变换属性,特别是scale(1,1),与box-shadow配合使用,可以召唤难以捉摸的影子。这项技术有效地触发了跨浏览器的阴影出现。
这是修改后的 CSS:
<code class="css">tr:hover { transform: scale(1); -webkit-transform: scale(1); -moz-transform: scale(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); }</code>
此解决方案消除了令人困惑的差异,确保表格行上框阴影的一致显示跨浏览器。
以上是为什么 Box Shadow 不适用于所有浏览器中的表行?的详细内容。更多信息请关注PHP中文网其他相关文章!