直接上代码

<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. ES6操作数组的7中方法

    ES6操作数组目前共有7中方法,分别是:forEach.map.filter.find.every.some.reduce forEach方法:对数组的每个元素执行一次提供的函数 1. forEach ...

  2. Python 在PDF中添加条形码、二维码

    在PDF中添加条码是一个常见需求,特别是在需要自动化处理.跟踪或检索PDF文件时.作为一种机器可读的标识符,PDF中的条码可以包含各种类型的信息,如文档的唯一标识.版本号.日期等.以下是一篇关于如何使 ...

  3. ASP.NET Core – Data Protection & Azure Storage + Azure Key Vault

    前言 以前就写过很多篇了 Asp.net core 学习笔记 ( Data protection ) Asp.net core 学习笔记 Secret 和 Data Protect Azure key ...

  4. ASP.NET Core – Razor Pages Routing

    前言 之前有提过, MVC 和 Razor Pages 最大的区别就在 Routing 上. Razor Pages 的结构是 route, page, model route match to pa ...

  5. Azure 入门系列 (第二篇 Backup 和 Disaster Recovery)

    本系列 这个系列会介绍从 0 到 1 搭建一个 Web Application 的 Server. 间中还会带上一些真实开发常用的功能. 一共 6 篇 1. Virtual Machine (VM) ...

  6. Apache-Shiro <=1.2.4 反序列化漏洞 (代码审计)

    一.Apache Shiro 简介: Apache Shiro提供了认证.授权.加密和会话管理功能,将复杂的问题隐藏起来,提供清晰直观的API使开发者可以很轻松地开发自己的程序安全代码.并且在实现此目 ...

  7. Windows系统环境变量

    添加环境变量: 添加系统变量,机器要重新启动 添加用户变量,机器不用重启: 一般添加环境变量都添加在用户变量中,但只针对这一用户生效 为了使的所有用户都能正常使用软件,通常添加系统变量

  8. Sqoop简介安装及使用

    Sqoop简介 sqoop 是 apache 旗下一款"Hadoop 和关系数据库服务器之间传送数据"的工具. 核心的功能有两个: 导入.迁入 导出.迁出 导入数据:MySQL,O ...

  9. linux内核调试痛点之函数参数抓捕记

    1.linux内核调试工具crash并不能直接显示函数参数,而这个对调试又非常重要 下面是工作中一个实际的问题,我们的进程hang在如下一个内核栈中了,通过栈回溯可知是打开了一个nfs3的网盘文件或者 ...

  10. “技术沙龙”来袭,邀您一同探讨 Serverless 数据库技术最佳实践

    如今,随着数据库的上云趋势,企业用户对业务连续性的要求越来越高,基于Serverless架构下的数据库也应运而生. Serverless数据库技术可以满足客户在公有云计算环境下根据业务发展弹性扩展集群 ...