直接上代码

<style type="text/css">
*{
margin: 0;
padding: 0;
}
.box{
width: 200px;
position: relative;
}
.box .icon-search{
width: 20px;
height: 20px;
position: absolute;
top: 6px;
right: 0;
}
.box .username{
padding-left: 30px;
height: 25px;
}
</style>
</head>
<body>
<div class="box"> <input type="text" class="username" />
<i class="icon-search">图</i>
</div>
</body>

html中input标签放入小图标的更多相关文章

  1. html中为何经常使用<i>标签来作为小图标呢?

    很多网站都是习惯使用<i></i>来代表小图标?而实际上用 <i> 元素做图标在语义上是不正确的(虽然看起来像 icon 的缩写),那么用<i>表示小i ...

  2. 关于django中input标签中file类型以及开路由

    0825自我总结 关于django中input标签中file类型 1.input提交图片实时展示 <img src="/static/img/default.png" wid ...

  3. HTML中input标签maxlength属性的妙处

    HTML中的input标签可是很常用的. HTML本身也非常简单,就是若干标签,每个标签有若干属性. 我在学习HTML的过程中,也没有太过重视. 今年,在写前端表单验证的时候,发现maxlength这 ...

  4. IE中input标签密码框与文本框宽度不一样问题

    前言 在项目登录界面中有账户和密码的输入框,在Chrome中显示是正常的(本人使用的是Chrome浏览器,平时不用IE).等部署到客户的服务器上,访问时发现一个问题,在IE浏览器中文本框与密码框的宽度 ...

  5. 如何隐藏 Safari 中 input 标签的 autofill 图标

    Safari 浏览器会为 <input type="passport"> 标签自动添加一个小锁的图标(如下图),本意上是让用户可以从这里选择相应的 用户名/密码 进行自 ...

  6. 微信小程序中input标签高度设置

    如果没有设置高度所以显示的是控件自身的高度. 微信小程序input控件原始设置: 上图发现: 我只覆盖了官方input的height,而没有覆盖min-height; .query input{ bo ...

  7. HTML中input标签的alt属性和title属性的比较

    经常用到这两个属性,但是一直没有总结他们的区别.现在我对他们两个的用法做一下总结: 相同点:他们都会飘出一个小浮层,显示文本内容. 不同点: 1.alt只能是元素的属性,而title即可以是元素的属性 ...

  8. Jsoup API解析HTML中input标签

    Jsoup官网地址:http://jsoup.org/ 1. 解析单个input元素     String html = "<p><input align=\"t ...

  9. html中input标签的tabindex属性

    当浏览者浏览网站时可以通过按TAB键在网页的链接中依次移动,这是一个相当方便实用的功能.但如果网页中链接太多,恐怕按TAB键就没什么作用了,这时不妨通过改变TAB键移动的顺序来突出重点,在某些重要页面 ...

  10. Html中input标签的使用

    1.取消按钮按下时的虚线框 在input里添加属性值 hideFocus 或者 HideFocus=true 2.只读文本框内容 在input里添加属性值 readonly 3.防止退后清空的TEXT ...

随机推荐

  1. 基于surging的产品项目-木舟开源了!

    一 . 概述 因为前段时间电脑坏了,导致代码遗失,踌躇满志马上上线的平台产品付之东流,现在熬夜在写代码希望能尽快推出企业正常使用的平台产品,而这次把代码开源,一是让大家对surging 使用有个深入的 ...

  2. Windows中Powershell中的 rm -rf 等效命令

    Remove-Item  -Recurse  -Force  <要删除的目录> 可以简写为: rm -r -fo  <要删除目录>

  3. 模板链表类的扩展(QListEx<T>)

    以前写的链表都是比较简单的,插入节点是在头节点上,所以循环链表时都是从最后一个数据往前找的,给人的感觉是倒着的, 今天写一个在链表尾部插入数据 1.链表节点类的定义 /链表节点类 template & ...

  4. Go channel 介绍

    Go 语言(Golang)中的 chan 是通道(channel)的缩写,用于在不同的 goroutine 之间进行通信.通道允许你在 goroutine 之间传递数据,从而实现同步和共享内存.下面是 ...

  5. 使用 nuxi build-module 命令构建 Nuxt 模块

    title: 使用 nuxi build-module 命令构建 Nuxt 模块 date: 2024/8/31 updated: 2024/8/31 author: cmdragon excerpt ...

  6. 技术解析 | ZEGO 移动端超分辨率技术

    ​ 即构超分追求:速度更快.效果更好.码率更低.机型更广. 超分辨率(Super Resolution, SR)是从给定的低分辨率(Low Resolution, LR)图像中恢复高分辨率(High ...

  7. 小tips:CSS3中的background-clip属性(背景的裁剪区域)

    CSS3中的background-clip属性,其主要是用来确定背景的裁剪区域,换句话说,就是如何控制元素背景显示区域. 语法如下: background-clip : border-box || p ...

  8. RxJS 系列 – Transformation Operators

    前言 前几篇介绍过了 Creation Operators Filter Operators Join Creation Operators Error Handling Operators 这篇继续 ...

  9. 微信js-sdk接入原理

    1.有一个微信公众号,并获取到该公众号的AppID和AppSecret. 其中AppID是可以对外公开的,AppSecret是该公众号的密钥,是需要绝对保密的 2.向微信服务器发送一个GET请求,获取 ...

  10. 【VMware VCF】使用 VCF Import Tool 将现有 vSphere 环境转换为管理域。

    VMware Cloud Foundation 5.2 发布并引入了一个新的功能,借助 VCF Import Tool 工具可以将现有 vSphere 环境直接转换(Convert)为管理工作负载域或 ...