在使用 input 输入框时,我们可能会遇到需要给其设置光标颜色的情况。谷歌浏览器的默认光标颜色是黑色的,GitHub 上的光标却是白色,那么这个用 CSS 怎么改变呢?

  上面描述的情景有两种实现方式:

  1.使用color来实现

  光标的颜色是继承自当前输入框字体的颜色,所以用 color 属性即可改变:

input{
color:red;
}

  

  2.使用caret-color来实现

上一种方式已经修改了光标的颜色但是字体的颜色也改变了,如果只想改变光标的颜色而不改变字体的颜色那就使用 caret-color 属性:

input{
caret-color:red;
}

  

  好了,通过上面的方式我们就可以修改 input 输入框光标颜色了~~~

Css——设置input输入框光标颜色的更多相关文章

  1. css只改变input输入框光标颜色不改变文字颜色实现方法

    input:focus{color:blue}//光标颜色 input{ text-shadow: 0px 0px 0px red;//文字颜色 -webkit-text-fill-color: tr ...

  2. css设置input不显示光标

    把光标颜色设置为透明色和父类一样就看不出来了,就好像取消了 caret-color: transparent; 设置了这个属性后,无论如何点击都好像没有光标似的

  3. 教你如何使用css隐藏input的光标

    今天公司的ui突然跑过来问我一个问题:"如何在不影响操作的情况下,把input的光标隐藏了?". 我相信很多人会跟我一样,觉得这是个什么狗屁需求,输入框不要光标这不是反人类吗?可惜 ...

  4. CSS设置input placeholder文本的样式

    placeholder是HTML5  input的新属性,英文意思是占位符,它一般表示input输入框的默认提示值. 下面是设置placeholder的文本样式的选择器的示例: /* webkit 浏 ...

  5. 控制input输入框光标的位置

    一:理解input, textarea元素在标准浏览器下两个属性selectionStart, selectionEnd. selectionStart: 该属性的含义是 选区开始的位置: selec ...

  6. vue-element-admin 之改变登录界面input的光标颜色

    前话:用框架原有的login更改而不重写的话,恰好当你input背景设置成白色的时候,光标会找不到=>原因:原框架的光标颜色是#fff 操作更改光标颜色: 找到src/views/login/i ...

  7. css设置input中placeholder字体

    设置input中placeholder字体颜色 input::-webkit-input-placeholder {color:@a;} input:-moz-placeholder {color:@ ...

  8. 怎样使用 CSS 清除 input 输入框聚焦选中时的蓝色边框?

     input 输入框的聚焦选中时的边框是由 outline 属性控制的, 直接使用: input { outline: none } 即可. 如下:

  9. css改变input输入框placeholder值颜色

    ::-webkit-input-placeholder { /* WebKit browsers */ color: #fff; } :-moz-placeholder { /* Mozilla Fi ...

随机推荐

  1. hadoop学习笔记(四):HDFS文件权限,安全模式,以及整体注意点总结

    本文原创,转载注明作者和原文链接! 一:总结注意点: 到现在为止学习到的角色:三个NameNode.SecondaryNameNode.DataNode 1.存储的是每一个文件分割存储之后的元数据信息 ...

  2. dubbo+zookeeper搭建笔记

    参考博客: http://blog.csdn.net/u013142781/article/details/50396621#reply http://blog.csdn.net/u013142781 ...

  3. 爬虫 - Scrapy中间件

    前提:看Scrapy架构图 不管什么Middlewares,都写在middlewares.py里面. 然后在settings.py里的DOWNLOADER_MIDDLEWARES或者SPIDER_MI ...

  4. 分布式系统:CAP 理论的前世今生

    CAP 理论是分布式系统设计中的一个重要理论,虽然它为系统设计提供了非常有用的依据,但是也带来了很多误解.本文将从 CAP 诞生的背景说起,然后对理论进行解释,最后对 CAP 在当前背景下的一些新理解 ...

  5. java篇 之 ==与equals

    ==是一个比较运算符,基本数据类型比较的是值,引用数据类型比较的是地址值. "=="比"equals"运行速度快,因为"=="只是比较引用. ...

  6. LA 3708 墓地雕塑(模拟)

    题目链接:https://vjudge.net/problem/UVALive-3708 这道题的思路也是比较难想. 首先根据上一题(Uva 11300)可知,要想让移动距离最短,那么至少要使一个雕塑 ...

  7. QBImagePickerController 不可选择照片流中照片

    因为QBImagePickerController使用的ALAssetsLibrary方式来读取图片,如果采用默认方式去执行,那么根据url读取到的asset会为空,这时候我们就 需要特殊处理 [se ...

  8. Ubuntu 18 设置静态 IP

    在Ubuntu 18中使用 netplan 命令 首先 cd /etc/netplan/ 找到 *.yaml文件(每个人可能不一样),编辑它 root@waydeserver:/etc/netplan ...

  9. 解决IDEA快捷键 Alt+Insert 失效的问题

    现象 IDEA快捷键 Alt+Inser 失效,单击右键也不出现[Generate]. 这个问题经常出现在重新安装IDEA后. 原因 缺少2个插件 解决办法 在setting中启用这2个插件即可.这2 ...

  10. 使刚编辑的vim编辑器配置文件立即生效(实为自动生效)

    简单的说,在虚拟机下安装的Centos6.3系统后,默认的是没有vim编辑器的配置文件,此时如果有必要,可以按照自己的习惯定制或配置自己的vim编辑器: 1,如果你是root权限,进入root目录下: ...