html中input标签放入小图标
直接上代码
<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标签放入小图标的更多相关文章
- html中为何经常使用<i>标签来作为小图标呢？
很多网站都是习惯使用<i></i>来代表小图标?而实际上用 <i> 元素做图标在语义上是不正确的(虽然看起来像 icon 的缩写),那么用<i>表示小i ...
- 关于django中input标签中file类型以及开路由
0825自我总结 关于django中input标签中file类型 1.input提交图片实时展示 <img src="/static/img/default.png" wid ...
- HTML中input标签maxlength属性的妙处
HTML中的input标签可是很常用的. HTML本身也非常简单,就是若干标签,每个标签有若干属性. 我在学习HTML的过程中,也没有太过重视. 今年,在写前端表单验证的时候,发现maxlength这 ...
- IE中input标签密码框与文本框宽度不一样问题
前言 在项目登录界面中有账户和密码的输入框,在Chrome中显示是正常的(本人使用的是Chrome浏览器,平时不用IE).等部署到客户的服务器上,访问时发现一个问题,在IE浏览器中文本框与密码框的宽度 ...
- 如何隐藏 Safari 中 input 标签的 autofill 图标
Safari 浏览器会为 <input type="passport"> 标签自动添加一个小锁的图标(如下图),本意上是让用户可以从这里选择相应的 用户名/密码 进行自 ...
- 微信小程序中input标签高度设置
如果没有设置高度所以显示的是控件自身的高度. 微信小程序input控件原始设置: 上图发现: 我只覆盖了官方input的height,而没有覆盖min-height; .query input{ bo ...
- HTML中input标签的alt属性和title属性的比较
经常用到这两个属性,但是一直没有总结他们的区别.现在我对他们两个的用法做一下总结: 相同点:他们都会飘出一个小浮层,显示文本内容. 不同点: 1.alt只能是元素的属性,而title即可以是元素的属性 ...
- Jsoup API解析HTML中input标签
Jsoup官网地址:http://jsoup.org/ 1. 解析单个input元素 String html = "<p><input align=\"t ...
- html中input标签的tabindex属性
当浏览者浏览网站时可以通过按TAB键在网页的链接中依次移动,这是一个相当方便实用的功能.但如果网页中链接太多,恐怕按TAB键就没什么作用了,这时不妨通过改变TAB键移动的顺序来突出重点,在某些重要页面 ...
- Html中input标签的使用
1.取消按钮按下时的虚线框 在input里添加属性值 hideFocus 或者 HideFocus=true 2.只读文本框内容 在input里添加属性值 readonly 3.防止退后清空的TEXT ...
随机推荐
- LaTeX 交叉引用的四次编译
编译包含交叉引用的 LaTeX 文件需要编译四次(pdflatex + bibtex + pdflatex * 2),一直对这四次编译都干了什么事很好奇.这次就来看一下每一步具体都干了些什么. 源文件 ...
- 远距离跨网络实现windows远程桌面连接
1.保证已经打开被连接电脑---远程访问---权限. 我的电脑--右键--属性--远程设置 2.选择允许连接 (选择用户和高级没有特殊设置可以不动,被连接电脑当前登陆的账号就可以满足权限) 3.打开- ...
- Angular 18+ 高级教程 – Change Detection & Ivy rendering engine
前言 不熟悉 Angular 的朋友可能不了解 Change Detection 和目前当火的 Signal 之间的关系,以至于认为现在应该要学习新潮流 Signal 而不是已经过时的 Change ...
- CSS – :has parent selector, @container container query, transform replacement, subgrid (2022 期待新功能)
前言 CSS 一直有一些老问题没有被解决. 2022 视乎看见了曙光. 参考 4 Exciting New CSS Features in 2022 :has() 参考: YouTube – How ...
- 前端项目通过 Nginx 发布至 Linux，并通过 rewrite 配置访问后端接口
〇.前言 本文通过将 arco 框架的前端项目,部署至 CentOS 7,并访问同服务器的 WebAPI 接口,来简单演示一下,如何将前端项目发布至 Linux 系统. 关于 ASP.NET WebA ...
- 【赵渝强老师】HBase的体系架构
一.什么是HBase? HBase是一个基于HDFS之上的分布式的.面向列的开源数据库,该技术来源于 Fay Chang 所撰写的Google论文"BigTable大表",即:把所 ...
- 《Vue.js 设计与实现》读书笔记 - 第7章、渲染器的设计
第7章.渲染器的设计 7.1 渲染器与响应系统的结合 渲染器需要有跨平台的能力. 在浏览器端会渲染为真实的 DOM 元素. const { effect, ref } = VueReactivity ...
- thinkphp中的or,like,in等联合查询
数据库中的两个字段有一个字段等于查询条件时,下面两个方法都是可以的: (1) $where['a.goods_name|a.goods_sn'] = array('like',"%$keyW ...
- opengl在编译的过程中，glad使用
我在编译的过程中,遇到:无法找到 -lglad这个错误.最后才发现对于glad的使用不能用-lglad.因为我们通过glad的在线服务可以得到一些文件,其中glad.c文件我们是需要放在我们的项目下面 ...
- 【PyTorch】state_dict详解
这篇博客来自csdn,完全用于学习. Introduce 在pytorch中,torch.nn.Module模块中的state_dict变量存放训练过程中需要学习的权重和偏执系数,state_dict ...