Question

所以这是我的问题：我有一个大容器div，并且在容器内有一个div。容器上有一个黑色的盒子阴影。当我将内部div的背景颜色设置为黑色时，您无法看到框阴影。我想也许这可能是由眼睛引起的错觉，但仔细看看你可以看到像素差异。 Example image.

以下是对此问题的更清晰的描述： Yet another example image

原始代码传入！

HTML :( div＃footerContainer部分几乎是重要部分）

<div id="bodyContainer">
<div id="menuContainer">
    <div id="menuElements" class="center">
        <a href="#"><div class="menuElement underlineHover" color="#FF0E0E">Home</div></a>
        <a href="#"><div class="menuElement underlineHover" color="#13DB13">Services</div></a>
        <a href="#"><div class="menuElement underlineHover" color="#1792BB">Photo Gallery</div></a>
        <a href="#"><div class="menuElement underlineHover" color="#E4146B">Why Use Fox Foliage?</div></a>
        <a href="#"><div class="menuElement underlineHover" color="#FF9616">Contact</div></a>
    </div>
</div>
<div id="barSpacer" style="margin: 0 auto 20px"></div>
<div id="imageContainer">
    <img src="images/image1.jpg"/>
    <div id="title">
        <div class="center">
            <p class="spaced">Fox Foliage</p>|<p class="spaced">352-949-2481</p></p>
        </div>
    </div>
</div>
<div id="barSpacer"></div>
<div id="contentContainer">
    <?php include("content.php") ?>
</div>
<div id="barSpacer"></div>
<div id="footerContainer">

</div>

CSS（容器DIV）：

div#bodyContainer{
max-width: 1000px;
background-color: white;
margin: 0 auto;
box-shadow: 0 0 30px 2px black;

}

CSS（页脚DIV）：

div#footerContainer {
height: 40px;
width: 100%;
background-color: black;
color: white;

}

整个目标是确保盒子阴影始终具有相同的一致性。

背景颜色正在影响盒子阴影

0 个答案: