代码之家 › 专栏 › 技术社区 › flash

如何在CSS中移动闪烁的光标?

cursor css html

flash · 技术社区 · 6 年前

我正在一个 website上工作,我想在其中向右移动闪烁光标,使其不在图标顶部。

我用来制作搜索图标的HTML和CSS片段是:

.searchIcon{
位置:绝对;
左:34.5%;
顶部:22.4%;
转换:translatey(-50%);
颜色:红色;
指针事件:无;
}<input class=“Form Control Search_Radius MB-4”type=“text”>
<span class=“fa fa search searchicon”aria hidden=“true”>/lt;/span>
</DIV>>=


     
     
     
     
     
     
     
      
       .searchicon {
  position: absolute;
  left: 34.5%;
  top: 22.4%;
  transform: translateY(-50%);
  color: red;
  pointer-events: none;
}
       <div class="input-searchicon">
  <input class="form-control search_radius mb-4" type="text">
  <span class="fa fa-search searchicon" aria-hidden="true "></span>
</div>

2 回复 | 直到 6 年前

Sreekanth Reddy Balne 6 年前

.input-searchicon input{
  padding-left: 35px;
}

.input-searchicon{
  position: relative;
}
.input-searchicon input{
  padding-left: 35px;
}
.searchicon {
    position: absolute;
    left: 5px;
    top: 10px;
    transform: translateY(-50%);
    color: red;
    pointer-events: none;
}

<link href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet"/>
<div class="input-searchicon">
        <input class="form-control search_radius mb-4" type="text">
        <span class="fa fa-search searchicon" aria-hidden="true "></span>
 </div>

Alvin Ching 6 年前

pl-1

 <div class="input-searchicon">
   <input class="form-control search_radius mb-4 pl-4" type="text">
   <span class="fa fa-search searchicon" aria-hidden="true "></span>
 </div>

Jsfiddle

推荐文章

user1181942 · 创建临时表后缺少“end”错误

6 年前

user2102665 · 将子查询值从游标提取到PL/SQL中的参数

6 年前

user2102665 · 在PL SQL游标中查询DBA\U表和USER\U表

6 年前

Matej · 将光标剪切到面板

6 年前

Spike Johnson · 如何将数据从DB移动到ViewPager?

6 年前

user1846348 · Android SQLite:如何使用从其他表检索的id从表中检索数据

6 年前

Max · jQuery:鼠标跟随元素在滚动时不会粘住光标

6 年前

Aditya Dwivedi · 这个mysql游标有什么问题,如何更正?

6 年前

Sinto · 如何在Froala编辑器中将光标放置在末端

6 年前

Joshua Edgar · 如何使用Intent发送SQLite数据库的电子邮件。额外的\u文本?

6 年前