IE6/IE7中text-indent对input背景的影响

在text-indent在IE6/IE7中的位置偏移BUG一文中讨论过IE6/IE7中inline-block元素设置text-indent对背景图片的影响,这主要是 display:inline-block在IE6/Ie7和IE8中的区别 导 致的。表单中的提交(type=submit)和重置(type=reset)按钮,有时我们为了美化,而使用背景图片,考虑到SEO因素,按钮的 value值不能为空,但又不能在页面上显示出来。这时就可以用text-over:-200em;overflow:hidden;来隐藏了。这时问题 就出现了,在IE6/IE7中背景图片也和文字一块被隐藏了。

解决办法也是一样的。就是给按钮设置display:block或者设置float:left|right来实现display:block。

<input type="submit" class="submit" value="提交" />
<style type="text/css">
.submit{
display:block;
width:150px;
height:30px;
overflow:hidden;
background:url(submit.gif) no-repeat left top;
text-indent:-100em;
}
</style> 由此推断IE6/IE7中input的实现和inline-block类似null

ie7 text-indent input影响的更多相关文章

  1. input text 字体的影响

    字体对input的影响 <html> <head> <meta charset="UTF-8"> </head> <style ...

  2. 给类型为text的input设置value值却无法修改

    给类型为text的input设置value值后就无法修改了 我的页面显示为如下但是退格却无法改变他的值 原来是缺少onChange事件,没法监听value的改变 所以需要添加 onChange={th ...

  3. How to change the button text of <input type=“file” />?

    How to change the button text of <input type=“file” />? Simply <label class="btn btn-p ...

  4. IE7下,input元素相对父级元素错位解决办法

    原因: 当input仅仅包含父元素,父元素拥有margin属性时,IE7的input就会错误的继承margin属性. 解决办法: 给input元素外面套一个span,label这样的内联元素,这样就会 ...

  5. 中文目录对 sublime text 有什么影响?

    用了这软件好几个月了,一直没出现问题.最近做精简时,发现一个奇怪的问题. 相同的配置,为什么两个程序表现得不一样? 难道是哪里的配置不一样? 难道是插件被我精简得太厉害了? 难道是插件有依赖文件被我删 ...

  6. 【转载】input 中 type='text' 的提交问题

    原文链接:http://www.nowamagic.net/html/html_AboutInputSummit.php 有时候我们希望回车键敲在文本框(input element)里来提交表单(fo ...

  7. 隐藏input边框(ie6、ie7)

    去掉元素的边框,我们一贯使用border:none; 但在ie6.ie7下的input[type=text]元素,并没有去掉. 两种解决方案: 1. border:none; 并设置背景backgro ...

  8. input type =text,按回车键自动提交

    1.当form表单中只有一个<input type="text" name='name' />时按回车键将会自动将表单提交 <form id='form1' ac ...

  9. [RxJS] Getting Input Text with Map

    By default, Inputs will push input events into the stream. This lesson shows you how to use map to c ...

随机推荐

  1. Thinking in Java:容器深入研究

    1.虚线框表示Abstract类,图中大量的类的名字都是以Abstract开头的,它们仅仅是部分实现了特定接口的工具,因此创建时能够选择从Abstract继承. Collections中的实用方法:挑 ...

  2. bzoj2958: 序列染色&&3269: 序列染色

    DP这种东西,考场上就只能看命了.. #include<cstdio> #include<iostream> #include<cstring> #include& ...

  3. 转四种常见的post请求

    HTTP/1.1 协议规定的 HTTP 请求方法有 OPTIONS.GET.HEAD.POST.PUT.DELETE.TRACE.CONNECT 这几种.其中 POST 一般用来向服务端提交数据,本文 ...

  4. Node.js:GET/POST请求

    ylbtech-Node.js:GET/POST请求 1.返回顶部 1. Node.js GET/POST请求 在很多场景中,我们的服务器都需要跟用户的浏览器打交道,如表单提交. 表单提交到服务器一般 ...

  5. Linux&nbsp;Oracle服务启动&amp;停止脚本与开机自启动

    在CentOS 6.3下安装完Oracle 10g R2,重开机之后,你会发现Oracle没有自行启动,这是正常的,因为在Linux下安装Oracle的确不会自行启动,必须要自行设定相关参数,首先先介 ...

  6. Blender插件之Panel

    目标 [x] 总结Blender之Panel 总结 Blender之Panel需要从Blender界面组成开始理解. 直观上Blender的界面层次为 Editors ‣ Regions ‣ (Tab ...

  7. Arduino-OLED-四度显示

    double Fahrenheit(double celsius) { ; } //摄氏温度度转化为华氏温度 double Kelvin(double celsius) { return celsiu ...

  8. RDS中的.frm和.ibd文件转换为sql文件

    --- 转自他人 mysql存储在磁盘中,各种天灾人祸都会导致数据丢失.大公司的时候我们常常需要做好数据冷热备,对于小公司来说要做好所有数据备份需要支出大量的成本,很多公司也是不现实的.万一还没有做好 ...

  9. vscode中eslint airbnb的简单配置

    vscode可以直接在扩展中下载安装eslint,然后,还不能用,需要继续如下步骤: 1.npm install -g eslint 安装完后输入"eslint",有东西出来说明安 ...

  10. 图片文字滚动插件jQuery Scrollbox

    图片文字滚动插件jQuery Scrollbox附件中提供了五种图片.文字滚动样式,只需调用jquery库和jQuery Scrollbox插件,然后再加一段简单的jquery代码即可使用,兼容性良好 ...