将input和img放同一行,img标签总是比input高出一个头,难看。后来在网站搜到最多的就是给img添加一个align="absmiddle"属性,这个方法似乎的确可行,但是不符合HTML标准。后来发现同时给input和img添加vertical-align:middle就行:

在写css时,使得input和img在同一行居中对齐的方法:

代码如下:
img{vertical-align:middle;}

input{width:宽度;height:高度;line-height:与高度一致;margin:0px;padding;0px;font-size:字体大小;border:边框;vertical-align:center;}

或直接这样写

input,img{vertical-align:middle;}

input框与img在同一行对齐的更多相关文章

  1. 解决Bootstrap布局注册表单input标签前增加必填项*提示与input框不在同一行问题

    注册表单部分代码如下: <form id="registForm" class="form-horizontal" action="${page ...

  2. bootstrap的两种在input框里面增加一个图标的方式

    具体代码如下: <div class="input-group"> <div class="input-icon-group"> < ...

  3. bootstrap在input框中加入icon图标

    <form class="form-horizontal"> <div class="form-group has-feedback"> ...

  4. 关于点击input框唤醒键盘导致input被遮盖的问题

    关于点击input框唤醒键盘导致input被遮盖的问题 这个问题相信大家在实际开发过程当中都有遇见,我自己也遇见过很多次.之前在百度上看见大多数的方法利用的都是键盘唤醒了之后,页面的实际高度会发生变化 ...

  5. input框focus时的美化效果

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  6. javascript onblur事件阻塞选中input框

    先上问题实例: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <t ...

  7. 如何让input框自动获得焦点

    项目中有个需求  一个用扫描枪输入的input框 为了避免每次都需要人为点击 需要做成当打开页面时该input框自动获取焦点 <input type="text" name= ...

  8. 类似input框内最右边添加图标,有清空功能

    <html> <head> <meta http-equiv="Content-Type" content="text/html; char ...

  9. php页面输出时,js设置input框的选中值

    /* 设置表单的值 */ function setValue(name, value) { var first = name.substr(0, 1), input, i = 0, val; if ( ...

随机推荐

  1. 使用Spring Initializr初始化SpringBoot项目

    虽然SpringBoot CLI消除了不少设置工作,但如果你更倾向于传统的Java项目结构,那你应该看看Spring Initializr. Spring Initializr从本质上来说就是一个we ...

  2. springboot笔记之helloworld

    开发工具:IDEA 2019 springboot版本:2.1.9 一.springboot2.x VS 1.x 基础环境升级 最低 JDK 8,支持 JDK 9,不再支持 Java 6 和 7 依赖 ...

  3. 洛谷 P3386 二分图匹配 题解

    题面 这道题虽然是练习匈牙利算法的,但可以用网络流来切掉它: 我们可以建立一个超级源和一个超级汇,超级源连接左部分点,超级汇连接右部分点: 然后在该图上跑最大流就可以了: PS:我设的超级源是2001 ...

  4. chrome://inspect 白屏BUG解决方案

    chrome://inspect 是前端常用的调试工具但是有时候会碰到PC端dev-tools白屏的问题 1.首先我们要处于[科][学]的网络环境 2.在 chrome 中输入chrome://app ...

  5. PythonDay09

    第九章函数 今日内容 函数定义 函数调用 函数返回值 函数的参数 函数定义 # 通过定义一个计算数据长度的函数,def为关键字,count_len是函数名def count_len(): lst = ...

  6. 实现添加相关资源的弹出ifreame 并实现多选框

    项目中:语音导览添加相关展品 字段:relactiveExhibitItem 长度 varchar2000 <div class="control-group"> &l ...

  7. RateLimit--使用guava来做接口限流

    转:https://blog.csdn.net/jiesa/article/details/50412027 一.问题描述   某天A君突然发现自己的接口请求量突然涨到之前的10倍,没多久该接口几乎不 ...

  8. localStorage 理解

    localStorage对象是HTML5的客户端存储持久化数据的方案.为了能访问到同一个localStorage对象,页面必须来自同一个域名(子域名无效),使用同一种协议,在同一个端口上. 过期策略: ...

  9. SpringBoot+SpringCloud 笔记

    SpringBoot总结 使用Typora打开https://pan.baidu.com/s/1tXS45j6ooXpnzhy1Zp78Gw 提取码: c8fi SpringCloud总结 使用XMi ...

  10. 三、使用Fiddler劫持网络资源(手机端)

    一.使用说明https://www.cnblogs.com/woaixuexi9999/p/9247705.html