未知属性'-moz-box-shadow'。宣言下降

Question

突然发生了什么？-moz-box-shadow？在我的设计中，Firefox控制台出现了一个奇怪的问题：

但是按照CSS Box Shadow rules我遵循了所有规则，然后发生了什么？这是它所指导的区块：

div.area {
  margin: 2px auto;
  border: 1px solid #ededed;
  -moz-box-shadow: 0 0 2px 0 #ccc;
     -webkit-box-shadow: 0 0 2px 0 #ccc;
     box-shadow: 0 0 2px 0 #ccc;
  margin-top: -80px;
  background-color: #ffffff;
  position: relative;
}

我也尝试了以下内容：

div.area {
      -moz-box-shadow: 0 0 2px #ccc;
         -webkit-box-shadow: 0 0 2px #ccc;
         box-shadow: 0 0 2px #ccc;
}

我正在使用Mozilla Firefox 20.0。

Answer 1

由于Firefox非常支持box-shadow，因此没有理由保留-moz-box-shadow。它在版本13中放弃了对前缀的支持，所以如果您真的关心警告并且不介意失去对旧版Firefox的支持，则可以删除该声明。对于最新版本的WebKit浏览器，-webkit-box-shadow也是如此。

Answer 2

box-shadow一年多以前不需要任何前缀（firefox 4和chrome 10）：https://developer.mozilla.org/en-US/docs/Web/CSS/box-shadow

Answer 3

在.css文件中，您只需找到Moz并将其重播到Webkit

示例

-moz-box-shadow  **to** -webkit-box-shadow

-moz-border-radius **to** -webkit-border-radius

-moz-border-top-left-radius **to** -webkit-border-top-left-radius

Answer 4

使用大多数浏览器的最新版本，您不需要使用-moz-box-shadow。

您可以简单地使用box-shadow。

在W3Schools

上详细了解相关信息