css 输入带边框半径的自动填充背景色

qacovj5a  于 5个月前  发布在  其他
关注(0)|答案(1)|浏览(67)

我有一个边界半径为10px的输入,我像这样更改它的自动填充背景颜色

input:-webkit-autofill,
  input:-webkit-autofill:hover,
  input:-webkit-autofill:focus,
  input:-webkit-autofill:active,
  input:-internal-autofill-selected,
  input:-internal-autofill-previewed {
     -webkit-box-shadow: 0 0 0 1000px #202327 inset;
  }

字符串
问题是角落仍然是原来的白色颜色后,我选择了自动填充选项。
我的代码是这样的

body {
  background-color: black;
}

input {
  height: 3rem;
  color: white;
  font-size: 1rem;
  font-weight: 500;
  padding: 0 1rem;
  border-radius: 10px;
  width: 50%;
  border: none;
  background-color: #202327;
  outline: none;
}

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active,
input:-internal-autofill-selected,
input:-internal-autofill-previewed {
  -webkit-box-shadow: 0 0 0 1000px #202327 inset;
  -webkit-text-fill-color: white !important;
  caret-color: white !important;
}
<input type="email" />

的数据

h5qlskok

h5qlskok1#

这工程完美

.field {
  -webkit-box-shadow: inset 0 0 0 30px #2E2E2E !important;
  background-clip: content-box !important;
}

字符串

相关问题