我在iPhone设备上有一个小的CSS问题.我的搜索输入为蓝色,当用户关注它时,插入符号几乎不可见:
在所有桌面浏览器中,即使在桌面Safari上,它也具有正确的颜色(白色).知道如何修复此问题并更改iOS设备上的插入颜色吗?
输入样式:
- input {
- background-color: $stateBlue;
- height: $navbarItemHeight;
- padding: 0 10px;
- vertical-align: bottom;
- color: $white;
- border-radius: $borderRadius;
- font-size: 1.1666666667em; // 16px
- -moz-appearance:none;
- -webkit-appearance:none;
- &::-webkit-input-placeholder {
- text-shadow: none;
- -webkit-text-fill-color: initial;
- }
- }
解决方法
这个名为
caret-color
的
W3C specification可以像这样使用:
- input[type="text"].custom {
- caret-color: red;
- }
- <div>
- <label>default caret:</label>
- <input type="text"/>
- </div>
- <div>
- <label>custom red caret:</label>
- <input type="text" class="custom"/>
- </div>
这是由Chrome(也在Android上),Firefox和Opera的currently supported.也许是个好消息:似乎Safari也支持它的技术预览版本,所以也许iOS Safari会跟随它.