html - Box-shadow 在 Chrome 中是黑色的，但在 Firefox 中是白色的？

Question

其实问题很简单，我的影子在google chrome里是黑色的，在firefox里是白色的，应该是黑色的。如果您有不同的意见，请务必说出来，因为我还是一名学生。

这是我的 HTML 代码:(这是荷兰语，但只是为了让您看到无政府状态。)

<div class="rechts">
    <h2>IN DE SPOTLIGHTS</h2>
    <p>Zondag 13 oktober beginnen we met ons nieuwe jaar! We starten om 13u30 en iedereen is natuurlijk meer dan welkom! KSA Scherpenheuvel is ook te vinden op <a href="https://www.facebook.com/pages/KSA-Scherpenheuvel/1065425993472427?fref=ts" style="color: black">facebook</a>!</p>

    <h2>FOTOMOMENT</h2>
    <p><img src="images/groepsfoto.jpg" width="400px" alt="foto niet beschikbaar" /><br /> Groepsfotooooo!</p>

    <h2>EXTRA</h2>
    <p><a href="baby.html" style="color: black;">babysitter nodig</a></p>
</div>

我的 div 类 rechts 的 css 代码:

.rechts{
    position:absolute;
    right:10px;
    top:500px;
    background-color:#4CAD5D;
    width: 450px;
    border-radius:4px ;
    box-shadow: 0 10px 7px #fff;
    -webkit-box-shadow: 0 10px 7px black;
    -moz-box-shadow: 0 10px 7px black;
    text-align: center;
}

Answer 1

您有“box-shadow”，然后与供应商前缀相同。第一个 box-shadow 里面有白色。

改变这个:

.rechts {
    box-shadow: 0 10px 7px #fff;
    -webkit-box-shadow: 0 10px 7px black;
    -moz-box-shadow: 0 10px 7px black;
}

对此:

.rechts {
    -webkit-box-shadow: 0 10px 7px #000;
    -moz-box-shadow: 0 10px 7px #000;
    box-shadow: 0 10px 7px #000;
}

您可以使用黑色或#000，但我更喜欢将供应商前缀自由行放在末尾。