CSS 径向渐变不适用于 iPhone 和 Mac

CSS radial gradient not work for iPhone and Mac

我的 div 背景样式有此代码,适用于所有移动设备和桌面,但不适用于 iOS。 这是我的代码:

#test{
box-shadow: -1px 0px 5px 1px #ccc;
padding:20px;
background: radial-gradient(#f7f7f7 2px, transparent 3px), radial-gradient(#f7f7f7 2px,transparent 3px), #fff;
background-position-x: 0%, 0%, 0%;
background-position-y: 0%, 0%, 0%;
background-size: auto, auto, auto;
background-position: 0 0, 20px 20px;background-size: 10px 10px;
height:100px;
}
<div id="test">
</div>

在 iOS 上,背景中的点显示为空而不是满。如何修复我的代码以在 iOS 设备上看到背景中的实心点?

也设置以下属性,因为只有 radial-gradient 不适用于所有浏览器。

background: -webkit-linear-gradient();
background: -moz-linear-gradient();
background: linear-gradient();

使用这个website 生成那些属性。