在input内添加小图标或文字(元/月)等
文字:
<td class="formValue">
<div class="input-group">
<input id="AccountBillPrice" type="number" class="form-control" /><span class="input-group-addon">元/月</span>
</div>
</td>

图标:
<div class="input-group">
<input id="AccountBillPrice" type="number" class="form-control" /><span class="input-group-addon"><i class="fa fa-pencil"></i></span>
</div>

或者使用自己的图标:
<input class='phone-input' type="text" id="phone"/>
.phone-input{
padding-right:20px;
background:url("resource/***.gif") no-repeat scroll right center transparent;
}
在input内添加小图标或文字(元/月)等的更多相关文章
- input输入框添加内部图标
有可能在制作网页的过程中遇到各种美化表单设计,这次我们来试着做一个demo 将input输入框添加内部图标 话不多说,看一下最终效果 我们的思路是,在一个div中,加入一个div和一个input标签, ...
- bootstrap中如何使input中的小图标获得点击事件
bootstrap中,放入input中的小图标是不能点击的. 在表单中经常遇见密码旁边的眼睛图标点击后,可使密码可见. 要使小图标获得点击事件,可在小图标上覆盖一个跟小图标一样大的透明层,然后给透明层 ...
- title中添加小图标
<title>标签中不能添加图片,但是可以添加小图标. 步骤: 1.做一个16 X 16像素的ico格式的图标.具体操作方法是,先在Photoshop中做一个透明背景的16 X 16像素P ...
- day3-3种实现小图标与文字水平对齐的方式
效果图: 1.使用小图标作为背景图实现 html: <div class="test"> <ul> <li class="method1&q ...
- android Editview中加小图标或者文字实现
关于这个问题,如果只是加小图标的话,已经提供了很好的支持,drawableLeft属性就可以设置左边的小图标,类推,右边也可以 不过如果你要加的是文字,我找了下,没有相应的属性,我们只能通过转换思路去 ...
- iOS开发之--使用storyboard下,tabbar小图标和文字颜色的设置
在开发项目的时候,如果是使用故事版设计的架构,那么在设置tabbar小图标的时候,可能会出现一点小问题, 成功的设置方法如下: 1.设置seleectedImage和image,其实就是非选中状态的图 ...
- css:图标与文字对齐的两种方法
(好久没写博客了,这几个月的积累比较零碎,记在本子上,现在开始整理归类) 在平时写页面的过程中,常遇到要把小图标与文字对齐的情况.比如: 总结了两种方法,代码量都比较少. 第一种 对img设置竖直方向 ...
- Vue.js 使用 Font Awesome 小图标
1.安装 Font Awesome npm i --save @fortawesome/fontawesome-svg-core npm i --save @fortawesome/free-soli ...
- 用Python给头像加上圣诞帽或圣诞老人小图标
随着圣诞的到来,想给给自己的头像加上一顶圣诞帽.如果不是头像,就加一个圣诞老人陪伴. 用Python给头像加上圣诞帽,看了下大概也都是来自2017年大神的文章:https://zhuanlan.z ...
随机推荐
- thinkphp概述2
thinkphp概述,thinkphp项目构建流程,thinkphp项目结构,thinkphp配置,thinkphp控制器,thinkphp模型,thinkphp视图,thinkphp的内置模板引擎. ...
- php与ajax技术
web2.0的到来,ajax逐渐成为主流,什么是ajax,ajax的开发模式,优点,使用技术.(ajax概述,ajax使用的技术,需要注意的 问题,在PHP应用ajax技术的应用) 什么是ajax,a ...
- uwsgi配置文件示例
uwsgi配置文件参考 相关路径请根据自己项目的实际路径配置 在进行Nginx+uwsgi部署Django项目的时候,需要Nginx的配置中包含uwsgi的配置项,具体请查看另一篇:Nginx配置文件 ...
- idea中添加多级父子模块
在 IntelliJ IDEA 中,没有类似于 Eclipse 工作空间(Workspace)的概念,而是提出了Project和Module这两个概念. 在 IntelliJ IDEA 中Projec ...
- orm字段类型使用
IntegerField:整数类型,映射到数据库中会变成11位的int类型 num是整型字典 object中的5是第五行还是id是5? 整型字符串型都可以传到整数字段 FloatField:浮点数类 ...
- [算法竞赛][2018][蓝桥杯][LanqiaoCA]第九届蓝桥杯A组
题目1 标题:分数 1/1 + 1/2 + 1/4 + 1/8 + 1/16 + .... 每项是前一项的一半,如果一共有20项,求这个和是多少,结果用分数表示出来.类似:3/2当然,这只是加了前2项 ...
- Jmeter4.0 _Beanshell解析并获取json响应数据数组长度
我们在做jmeter接口测试的时候,有时候碰到开发没返回数据total,只返回了一条条记录,可是呢,我们又需要知道到底返回了多少条数据时,咋办呢?咋办呢?咋办呢? 不要急,接下来,让我们见证奇迹是如何 ...
- 思考---(科研99% )VS (产品75%)
转目前人脸识别技术的挑战是什么? - 知乎 标签: | 发表时间:-- : | 作者: 出处:https://www.zhihu.com 也是放假太闲,上知乎来锻炼一下手指. 在回答题主的问题的时候, ...
- JavaScript解析机制之变量提升
1.什么是预解析? 在当前作用域下,JS 运行之前,会把带有 var 和 function 关键字的事先声明,并在内存中安排好.(这个过程也可以理解为变量提升)然后再从上到下执行 JS 语句(预解析只 ...
- pyspark AttributeError: 'NoneType' object has no attribute 'setCallSite'
pyspark: AttributeError: 'NoneType' object has no attribute 'setCallSite' 我草,是pyspark的bug.解决方法: prin ...