关于chrome表单input的黄色背景重置的解决方案

最新推荐文章于 2021-08-18 17:45:37 发布

编号90015478

最新推荐文章于 2021-08-18 17:45:37 发布

阅读量794

点赞数 1

分类专栏： css 文章标签： chrome css

本文链接：https://blog.csdn.net/qq_20353887/article/details/51462459

版权

css 专栏收录该内容

4 篇文章 0 订阅

订阅专栏

chrome表单自动填充后，input文本框的背景会变成偏黄色的，这是由于chrome会默认给自动填充的input表单加上input:-webkit-autofill私有属性，然后对其赋予以下样式：
input:-webkit-autofill{
    background-color:#FAFFBD;
    background-image: none;
    color:#000;
}

可以对input:-webkit-autofill使用足够大的纯色内阴影来覆盖input输入框的黄色背景；如：
input:-webkit-autofill{
    -webkit-box-shadow:000px1000px white inset;
    border:1px solid#CCC!important;边框改变
}

或
input:-webkit-autofill{
    -webkit-box-shadow:000px1000px white inset;
    border:1px solid#CCC!important;
    height:27px!important;
    line-height:27px!important;
    border-radius:0 4px 4px 0;圆角
}