CSS4.0校验提示overflow-anchor为未知属性，弃用CSS属性兼容问题咨询

各废弃/非标准CSS属性替代方案 #

• overflow-anchor: none
  该属性属于W3C正式标准，报错是校验工具规则库未更新导致，无需替换。不支持该属性的低版本浏览器会自动忽略，不会引发样式异常，可直接在校验工具中添加该属性到白名单忽略报错。
• appearance: none
  属于标准属性，补全前缀即可兼容旧版本浏览器，校验报错同样是规则库问题，添加白名单即可：

-webkit-appearance: none;
-moz-appearance: none;
appearance: none;

• ::-ms-input-placeholder
  这是IE/旧版Edge独有的输入框占位符伪元素，重复声明可直接删除其中一条。不需要兼容IE/Edge Legacy可直接删除该属性，需要兼容的话补全全平台写法：

/* IE/旧版Edge */
::-ms-input-placeholder {
  color: #999;
}
/* 低版本火狐 */
:-moz-placeholder {
  color: #999;
  opacity: 1;
}
/* 高版本火狐 */
::-moz-placeholder {
  color: #999;
  opacity: 1;
}
/* 标准写法：Chrome/ Safari/新版Edge */
::placeholder {
  color: #999;
}

• -ms-flex-positive
  IE10/11对flex-grow的私有前缀写法，不需要兼容IE可直接删除，需要兼容的话搭配标准属性写：

-ms-flex-positive: 1;
flex-grow: 1;

• -webkit-fill-available
  对应标准属性为stretch，兼容写法如下：

width: -webkit-fill-available;
width: -moz-available;
width: stretch;

• color-adjust: exact
  该属性已被重命名为print-color-adjust，替换为标准写法即可，旧属性可保留做降级兼容：

color-adjust: exact;
print-color-adjust: exact;

• -html-user-drag
  你漏写了webkit前缀，正确私有属性是-webkit-user-drag，标准替代方案是直接在DOM元素上添加原生属性draggable="false"，无需CSS定义即可实现相同的禁用拖拽效果。
• -ms-flex-preferred-size
  IE10/11对flex-basis的私有前缀写法，不需要兼容IE可直接删除，需要兼容的话搭配标准属性写：

-ms-flex-preferred-size: 0;
flex-basis: 0;

• :autofill、-webkit-autofill
:-webkit-autofill是WebKit内核浏览器的自动填充伪类，对应标准伪类为:autofill，兼容写法：

input:-webkit-autofill {
  box-shadow: 0 0 0 1000px #fff inset;
}
input:autofill {
  box-shadow: 0 0 0 1000px #fff inset;
}

校验报错通用解决方法 #

你遇到的CSS4.0校验报错大多是校验工具规则库未跟进最新标准、未兼容厂商前缀导致的，可按以下方案处理：

1. 直接删除不需要兼容的老旧私有前缀属性，减少代码冗余
2. 给校验工具添加上述属性的白名单，忽略对应报错
3. 如果使用Stylelint做校验，可更新stylelint-config-standard到最新版，或者在配置文件的rules字段添加以下规则：

"property-no-unknown": [true, { 
  "ignoreProperties": ["overflow-anchor", "print-color-adjust", "appearance"] 
}]

内容的提问来源于stack exchange，提问作者Prem Singh