Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

IOS Safari/webview input:disabled时 颜色变浅的兼容 #116

Open
lovelmh13 opened this issue Jul 23, 2021 · 0 comments
Open

IOS Safari/webview input:disabled时 颜色变浅的兼容 #116

lovelmh13 opened this issue Jul 23, 2021 · 0 comments

Comments

@lovelmh13
Copy link
Owner

1.设置 -webkit-text-fill-color

input:disabled, input[disabled] {
  -webkit-text-fill-color: #2c363f;
  opacity: 1;
}

这时发现字体颜色和边框颜色都起作用了,但是还存在一个问题就是input 的placeholder 和颜色也被改成了 #2c363f 这个颜色,但是我们需要保持 placeholder 原来的颜色,于是还需要添加另外的css

2.设置 placeholder

input[disabled]::placeholder {
  -webkit-text-fill-color: darkgray;
}

补充一些其他需注意的表单样式

input, button, select, textarea {
  /*去掉ios阴影*/
  -webkit-appearance: none;
  /*去掉ios点击高亮*/
  -webkit-tap-highlight-color: transparent;
  /*聚焦时去掉轮廓*/
  outline: none;
  /*去掉边框*/
  border: none;
  
}

select, button {
  /*去掉灰色背景*/
  background: transparent;
}

textarea{
  /*禁止手动改变文本框大小*/
  resize: none;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant