css中input标签与图片按钮对不齐怎么办

   页面中img和input顶部总对不齐,预览效果如下:


  解决方法其实很简单,我们只要给图片加上vertical-align:middle属性就可以了。

 代码如下  

<input name="veryhuo" type="text" size="28" value="" style="vertical-align:middle" />

<img src="h/images/8831logo.gif" style="cursor:pointer; vertical-align:middle" />

  例子

 代码如下  

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<style type="text/css">
    input, img {
        width:30px;
        height:30px;
        padding:10px 10px;
        margin:20px 20px;        
        border: 2px inset;
        vertical-align:middle;
    }
</style>
</head>
<body style="margin:0px 0px;">
    <input type="text" value="text" />
    <img src="/Images/search.png" />
</body>
</html>

  效果如下

时间: 2024-12-03 15:23:16

css中input标签与图片按钮对不齐怎么办的相关文章

css中input标签与图片按钮对不齐解决方法

页面中img和input顶部总对不齐,预览效果如下: 解决方法其实很简单,我们只要给图片加上vertical-align:middle属性就可以了.  代码如下 复制代码 <input name="veryhuo" type="text" size="28" value="" style="vertical-align:middle" /> <img src="h/images/

Input标签与图片按钮水平对齐解决方法

昨日,小编的朋友就来咨询,说他也遇到了这个问题,并且使用margin.padding等Css语法,都没有解决. 解决方法其实很简单,我们只要加上vertical-align:middle属性就可以了. 来看实例:   <input name="jb51" type="text" size="28" value="" style="vertical-align:middle" /> <img

iOS原生如何加载HTML中img标签的图片

原文出自:iOS原生如何加载HTML中img标签的图片 前言 最近iOS App项目中使用Webview加载H5页面比较多,也有不少朋友经常问到这个问题,在这里我也学习学习如何通过iOS原生的方式来加载H5页面中的图片然后让webview显示图片. 相信有很多朋友也遇到过这样的问题,可是很多朋友都没有思路,不知如何入手.今天,刚好学习了一下,并写了一个简单的demo.下面让我们一起来学习一下吧! 本篇文章适合哪些人群阅读? 项目中有类似需求的,而又没有思路的 曾经做过类似需求的,可以参考两者的思

关于HTML中input标签checkbox类型的疑问

问题描述 关于HTML中input标签checkbox类型的疑问 首先产生疑问的由来是我之前自己写的代码,需要实现选中删除的原理,可能是看别人的,也可能是自己灵光一现,实现了这个功能,但是如今回头看看又不懂了,所以在这里做个死记硬背的总结,也期待一个大神来开导我一下. 在form表单中代码是这样的(因为尖括号会被屏蔽所以用中文中括号代替) [input type='checkbox' name='eletment[ ] ' value='$id'] 于是我们用php把$id的变为数据库里相对应的

alertcontroller-iOS8 之后使用UIAlertController 如何actionSheet style中添加多个图片按钮

问题描述 iOS8 之后使用UIAlertController 如何actionSheet style中添加多个图片按钮 类似于分享那种actionSheet,在弹出试图中添加多个图片按钮 解决方案 我有一个demo,你可以参考一下!不知道你是否现在需要! 解决方案二: 可以换种思路吗?不用UIAlertController,用那种下拉菜单,至于你需要往哪里弹出来可以自己设置

html中input标签的tabindex属性

当浏览者浏览网站时可以通过按TAB键在网页的链接中依次移动,这是一个相当方便实用的功能.但如果网页中链接太多,恐怕按TAB键就没什么作用了,这时不妨通过改变TAB键移动的顺序来突出重点,在某些重要页面上方便访问者. 使用TABINDEX属性可以设置TAB键在链接中的移动顺序.把链接的TABINDEX属性设成1到32767的一个值,就可以把这个链接加入到 TAB键的序列中,而若把TABINDEX属性设为一个负值(如TABINDEX="-1"),那么这个链接将被排除在TAB键的序列之外.

批量修改标签css样式以input标签为例_jquery

$("input[style]").each(function(){ $(this).css("border-width","1"); $(this).css("background-color","#A9A9A9"); }); 以上是小编为您精心准备的的内容,在的博客.问答.公众号.人物.课程等栏目也有的相关内容,欢迎继续使用右上角搜索按钮进行搜索css样式 input标签 css input 样式.cs

input标签写CSS时需要注意的几点

飞鱼的声纳顶部的搜索框让我头疼了很长时间,原因是总不能获得跨浏览器的统一样式.主要的问题有这么两个:一是input标签的高度不能统一,Firefox和IE中的高度始终不能一致;二是在IE浏览器中属性为text的input标签中的输入文字不像标准浏览器中的那样垂直居中显示,而是靠输入框的左上角显示. 为了彻底解决搜索框的这些问题,我以GreenGaint主题搜索框的样式为准,重写了一遍代码并且以像素为单位测量了一下在没有任何样式表的情况下<input>标签在默认浏览器中的实际差别. 结果发现:i

用CSS美化input file按钮的方法

我们在做表单的情况下,input.textarea.button的样式比较容易定义,select和input file的样式难以定义. input file在系统默认下的外观: 我们最多通过定义input的border来改变系统默认的外观: 如果要让浏览按钮更漂亮一点,我们想定义它的背景颜色,甚至想用背景图片来代替,通过css定义input flie还真是办不到的.偶然看到一篇文章:input file 文件选择框美化 作者是把系统默认的按钮设置透明度为0,再定义一个label标签样式,来覆盖透