一起使用border-radius和box-shadow (CSS)

Question

好的，我知道这些属性都不完全受支持，但我还是在使用它们：P

当我添加边框半径和框阴影（有和没有供应商前缀）时，边框半径的半径对框阴影不透明。示例： http ://cndg.us/3f41a0

这可以解决吗？我还注意到 -webkit-box-shadow 在隐藏 div 方面存在一些问题。

原文由 Gary 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

可以在这里查看：http: //jsfiddle.net/Zw4QA/1/

我认为您的 div 中有一个带有圆角的元素。您必须将角应用于此元素。目前，除非您在 CSS 中指定，否则父元素上的圆角将不适用于子元素。

更多 CSS3 魔法检查这个链接： http ://css3please.com/

请注意，每个浏览器都有自己处理阴影和边框半径的方式 http://thany.nl/apps/boxshadows/

原文由 meo 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 2

根据 MDN 的文档，box-shadow 会自动选择元素本身的 border-radius。这是一个链接： https ://developer.mozilla.org/en-US/docs/Web/CSS/box-shadow#:~:text=The%20box%2Dshadow%20property%20enables,on%20the%20same% 20rounded%20corners

原文由 Daggie Blanqx - Douglas Mwangi 发布，翻译遵循 CC BY-SA 4.0 许可协议