iOS safari输入插入颜色

前端之家收集整理的这篇文章主要介绍了iOS safari输入插入颜色前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我在iPhone设备上有一个小的CSS问题.我的搜索输入为蓝色,当用户关注它时,插入符号几乎不可见:

在所有桌面浏览器中,即使在桌面Safari上,它也具有正确的颜色(白色).知道如何修复此问题并更改iOS设备上的插入颜色吗?

输入样式:

  1. input {
  2. background-color: $stateBlue;
  3. height: $navbarItemHeight;
  4. padding: 0 10px;
  5. vertical-align: bottom;
  6. color: $white;
  7. border-radius: $borderRadius;
  8. font-size: 1.1666666667em; // 16px
  9. -moz-appearance:none;
  10. -webkit-appearance:none;
  11.  
  12. &::-webkit-input-placeholder {
  13. text-shadow: none;
  14. -webkit-text-fill-color: initial;
  15. }
  16. }

解决方法

这个名为 caret-colorW3C specification可以像这样使用:
  1. input[type="text"].custom {
  2. caret-color: red;
  3. }
  1. <div>
  2. <label>default caret:</label>
  3. <input type="text"/>
  4. </div>
  5. <div>
  6. <label>custom red caret:</label>
  7. <input type="text" class="custom"/>
  8. </div>

这是由Chrome(也在Android上),Firefox和Opera的currently supported.也许是个好消息:似乎Safari也支持它的技术预览版本,所以也许iOS Safari会跟随它.

猜你在找的iOS相关文章