4

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

这是我的 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 类的 CSS 代码rechts：

.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;
}
4

2 回答 2

5

您有“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，但我更喜欢将供应商前缀免费行放在末尾。

于 2015-11-08T01:18:50.347 回答
1

最好先用前缀编写代码，然后再不加前缀，IE：

-webkit-box-shadow: 0 10px 7px black;
-moz-box-shadow: 0 10px 7px black;
box-shadow: 0 10px 7px #fff;

这里的问题是你的无前缀box-shadow是#fff等于白色。一些浏览器（取决于版本等）将使用不带前缀的版本，即使带前缀的版本在不带前缀的版本之后。

将其更改为box-shadow: 0 10px 7px #000;（或使用black代替#000），你会很好。

于 2015-11-08T01:18:01.793 回答