Css Webkit掩码大小不工作

我正在尝试使用webkit蒙版大小使蒙版图像变小。像这样：

.myClass {
    width: 100%;
    height: 100%;
    background: #ffffff;
    -webkit-mask-size: 50% 50%;
    -webkit-mask: url(../css/images/myimage.png) center center;
}

应用myClass的div有一个父容器，该容器上设置了固定的高度

---

无论我设置了什么-webkit掩码大小都没有区别。

嗯。我想可能是webkit掩码url后面的那个中心。此外，还应设置webkit掩码位置。请看下面的代码：

.myClass {
    width: 100%;
    height: 100%;
    background: red;
    /*-webkit-mask-size: 50% 50%;*/
    -webkit-mask-position: 0 0;
    -webkit-mask-size: 200px 200px;
    -webkit-mask-image: url(https://dl.dropboxusercontent.com/u/535060/mask.png);
}

它对我有用。。。这是小提琴：

只需交换订单：

.myClass {
    width: 100%;
    height: 100%;
    background: #ffffff;
    -webkit-mask: url(../css/images/myimage.png) center center;
    -webkit-mask-size: 50% 50%;
}

指定整个属性-webkit mask时，它包含所有子属性的值，因此它会重置-webkit mask大小

如果你把它设为最后一个，那就不会发生

---

或者，单独指定子属性（图像、位置、大小…

，这是因为您使用

center