![8px]( "8px")
本文介绍了框阴影在浮动div的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！ 问题描述 我有一个问题渲染框阴影浮动div！ Ive在chrome和firefox中测试了相同的结果。 < html& < head> < / head> < body> < div style =float：left; clear：left; background-color：#aaa; -moz-box-shadow：0px 8px 8px＃000; width：200px; height：200px;> < / div> < div style =float：left; clear：left; background-color：#aaa; -moz-box-shadow：0px 8px 8px＃000; width：200px; height：200px;> < / div> < / body> < / html> 编辑：顶部的div不会在下面的div上渲染它的阴影， 解决方案在Firefox 4中适用于我，但该代码永远不会在chrome或safari上工作， -moz 是一个供应商标记，表示mozilla 您需要添加以下所有内容 -moz- box-shadow：0px 8px 8px＃000; width：200px; -webkit-box-shadow：0px 8px 8px＃000; width：200px; box-shadow：0px 8px 8px＃000; width：200px; -webkit / Safari，以下将为支持它的供应商添加下拉阴影，然后当它得到普遍支持时，最后一条规则将覆盖所有浏览器。 编辑： top div的dropshadow超过其他元素你必须 position：relative ，然后给它一个 z-index 高于底部一个。 I got a problem rendering box-shadows over floating divs!Ive tested in chrome and firefox with the same result. <html> <head> </head> <body> <div style="float:left; clear: left; background-color: #aaa; -moz-box-shadow: 0px 8px 8px #000; width: 200px; height: 200px;"> </div> <div style="float:left; clear: left; background-color: #aaa; -moz-box-shadow: 0px 8px 8px #000; width: 200px; height: 200px;"> </div> </body> </html>Edit: The div on top doesn't render its shadow on the div below, is there any fix for this problem or do I have to try a different solution?regards/Joel 解决方案 Works for me in Firefox 4, but that code will never work on chrome or safari, the -moz is a vendor tag indicating mozilla.You need add all of the following-moz-box-shadow: 0px 8px 8px #000; width: 200px;-webkit-box-shadow: 0px 8px 8px #000; width: 200px;box-shadow: 0px 8px 8px #000; width: 200px;-webkit is the vendor tag for Chrome/Safari, the following will add in drop shadows for the vendors that support it and then when it's universally supported the last rule will cover all browsers.Edit: To get the top div's dropshadow over the other element you must position:relative and then give it a z-index higher than the bottom one. 这篇关于框阴影在浮动div的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！ 09-10 20:41