模仿闪烁的光标

<span class="cursor-blink">&nbsp;</span>

样式代码:

 .cursor-blink {
display: inline-block;
width: 1px;
animation: blink 1s infinite steps(1, start);
}
/*这里设置动画blink*/
@keyframes blink {
0%, 100% {
background-color: #000;
color: #aaa;
}
50% {
background-color: #bbb; /* not #aaa because it's seem there is Google Chrome bug */
color: #000;
}
}

&nbsp;占半个字符,闪烁起来有点大,命令工具闪烁,所以加一个宽度

根据场景需要,可以用伪类实现,::bdefore或者::after,需要的小伙伴可以试试

仅做参考

模仿input闪烁光标的更多相关文章

  1. RichtextBox去除闪烁光标

    http://files.cnblogs.com/xe2011/CustomRichTextBox_HideCaret.rar richTextBox能高亮选择,光标仍在,没有光标闪烁 把重RichT ...

  2. JQUERY实现点击INPUT使光标移动到最后或指定位置

    下面本文章给大家简单介绍一下JQUERY实现点击INPUT使光标移动到最后或指定位置例子,希望对各位有帮助,你要知道面对一个 处女座的 需求者, focus()是远远不够的,比如说“我点进去的时候光标 ...

  3. 在IOS11中position:fixed弹出框中的input出现光标错位的问题

    问题出现的背景: 在IOS11中position:fixed弹出框中的input出现光标错位的问题 解决方案 一.设计交互方面最好不要让弹窗中出现input输入框: 二.前端处理此兼容性的方案思路: ...

  4. Css——设置input输入框光标颜色

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

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

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

  6. ios11,弹出层内的input框光标错位 键盘弹出时,输入信息,光标一直乱跳

      之前开发了一个微信项目,维护期中苹果手机突然出现光标错位现象,经过排查,发现是最新的ios11系统的锅. 具体情况:弹出层使用position: fixed:弹出层内附带input/textare ...

  7. h5 ios手机 隐藏input输入光标

    前面在做一个H5中用到的6位数字密码弹框(类似支付.微信那种)时,遇到一个可怕问题,那就是在浏览器和安卓中是不显示输入光标的,但是在ios手机上光标总是能看见,像穿透一样地显示最外层. 先说下实现密码 ...

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

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

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

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

随机推荐

  1. 用户id,组id和文件访问权限

    实际用户ID和实际组ID:标示了我们究竟是谁,这两个字段在登录时取自口令文件中的登录项 有效用户ID和有效组ID以及附属组ID:决定了我们的文件的访问权限(通常有效用户ID等于实际用户ID,有效组ID ...

  2. Log4j源码分析

    一.slf4j和log4j的关系: 也就是说slf4j仅仅是一个为Java程序提供日志输出的统一接口,并不是一个具体的日志实现方案,就比如JDBC一样,只是一种规则而已.必须搭配具体的log实现方案比 ...

  3. 19.1 PORT CONTROL DESCRIPTIONS

    [原文] PORT CONFIGURATION REGISTER (GPACON-GPJCON) In S3C2440A, most of the pins are multiplexed pins. ...

  4. python selenium-webdriver 等待时间(七)

    测试过程中,我们经过发现脚本执行的时候展现出来的效果都是很快结束了,为了观察执行效果我们会增加一个等待时间来观察一下执行效果.这种等待时间我们只是为了我们便于观察,这种情况下是否包含等待时间不会影响我 ...

  5. celery+Rabbit MQ实战记录

    基于以前的一篇文章,celery+Rabbit MQ的安装和使用, 本文更加详细的介绍如何安装和使用celey, Rabbit MQ. 并记录在使用celery时遇到的一些问题. 1.安装 Rabbi ...

  6. 剑指offer 12.代码的完整性 数值的整数次方

    题目描述 给定一个double类型的浮点数base和int类型的整数exponent.求base的exponent次方.   本人渣渣代码: public double Power(double ba ...

  7. update_engine-DownloadAction(二)

    在update_engine-DownloadAction(一)中对DownloadAction介绍到了DeltaPerformer的Write方法.下面开始介绍Write方法. src/system ...

  8. 代理设计模式在auto_ptr及smart_ptr中的体现

    下面这段代码是auto_ptr的实现: class Image { public: Image(string name): m_imageName(name) {} virtual ~Image() ...

  9. python3-基础8

    模块与包 什么是模块 模块就是一个包含了python定义和声明的文件,文件名就是模块名字加上.py的后缀. #在python中,模块的使用方式都是一样的,但其实细说的话,模块可以分为四个通用类别: 1 ...

  10. 基于STM8的IIC协议---STM8-第五章

    1. 综述 I2C(IIC,Inter-Integrated Circuit),两线式串行总线,由PHILIPS公司开发用于连接微控制器及其外围设备. 它是由数据线SDA和时钟SCL构成的串行总线,可 ...