Question

是否可以在HTML输入中显示闪烁插入符permanataly而无需关注输入？

如果不是，我会将一个形状像插入符号的CSS div设计为闪烁，并在聚焦时消失，但在我去那个麻烦之前是否有更简单的方法？

Answer 1

您可以尝试动画背景：

＆＃13;

input:focus {
  background-image:none;
}
input {
  animation: blink-empty 1s infinite;
  background-image:/*linear-gradient(black,black)*/ linear-gradient(red,red);
  background-position: 1px  center;
  background-repeat: no-repeat;
  background-size:1px 1.2em;
}
@keyframes blink-empty {
  30%, 75%{background-size:1px 1.2em;}
  50% {background-size: 0 1.2em;}
}

＆＃13;

<p>fake carret on left side colored red for demo. but will not follow text if any.</p>
<input type="text" value=""/>

＆＃13;

你可以在http://codepen.io/gc-nomade/pen/jyLMLd

玩它

HTML输入，没有焦点的闪烁插入符号？

1 个答案: