初衷是想给这个提交按钮<input type="submit" value=" />加上背景图片,用了以下css样式:

 .subtn input {
background-attachment: scroll;
background-image: url(images/btn.gif);
background-repeat: no-repeat;
background-position: 0px 0px;
height: 20px;
width: 60px;
border-style: none;
}

但是不知道是怎么回事,在Internet Explorer 6、7、8中皆无法显示该背景图片按钮,依然是默认的按钮形式,而在Firefox和Chrome中皆可以正常显示,可以排除图片链接的有效性,尝试修改了很多次都没有成功。后来使用background简写属性,在一个声明中设置所有的背景属性,在Internet Explorer居然可以正常显示了:

 .subtn input {
background: url(images/btn.gif) no-repeat scroll 0px 0px;
height: 20px;
width: 60px;
border-style: none;
}

刚开始我在想是不是我的网页代码存在特殊性,其他代码可能影响了该样式,但是后来我单独新建了一个.html,里面只写了个form,一个输入框,一个提交框,在使用上面的background属性分开写的css属性后,结果问题依旧,可以说明这是一个普遍性的问题!CSS文档中有提到:

通常建议使用简写属性,而不是分别使用单个属性,因为简写属性在较老的浏览器中能够得到更好的支持,而且需要键入的字母也更少。

但是我想现在的问题已经不是浏览器版本老的问题了,而是Internet Explorer的问题了。

浏览器能正常显示的怪现象。最后我在网上找到了这段话:IE图片格式问题会导致IE无法显示图片。对于IE来说,直接改后缀名会导致图片不能显示。如果后缀名跟文件自身的格式不相符合,也是一样会无法显示。firefox这些浏览器不会有影响,他们可以自己识别。真相大白了,在css里换了一张图片,没问题了,ie和firefox都能显示了。没想到ie这么脆弱,说罢工就罢工。

链接图片的反括号和定位值一定要加个空格,如url(images/bg_media_lihover.gif) 5px 6px no-repeat #00a1de;

为了保证背景图片能够正常显示,建议使用绝对路径,而不是相对于CSS的路径。还是莎士比亚说得好:There are a thousand BUG in a thousand Internet Explorer

background: url(../images/in_bon_02.png) no-repeat scroll 0 0 rgba(0, 0, 0, 0);

IE不显示原来是,rgba(0, 0, 0, 0)的原因。

最新文章

  1. linux yum安装jdk
  2. URAL 1549 Another Japanese Puzzle(构造)
  3. 三分套三分 --- HDU 3400 Line belt
  4. CPU信息查询
  5. 2013-10-25笔记,css: mini-width, 标准居中,样式中*号使用,背景图像位置定位
  6. java笔试题(4)
  7. 我的总结SVN的使用
  8. js关闭页面(兼容浏览器)
  9. 单纯形法C++实现
  10. hdoj 1201 18岁生日
  11. 我为什么放弃了win7系统
  12. Linux CPU 亲和性
  13. [转]ARM/Thumb2PortingHowto
  14. Android init.rc文件浅析
  15. Delphi制作图像特殊显示效果
  16. window server2012 许可证过期
  17. Docker - 生成镜像
  18. Linux 安装源码软件
  19. 【错误】IntelliJ IDEA使用Gradle编译报错
  20. 网页启用Gzip压缩 提高浏览速度

热门文章

  1. smarty在循环的时候计数来显示这是第几次循环的功能
  2. 又见The request sent by the client was syntactically incorrect ()
  3. POJ 1040 Transportation
  4. Android Studio Gradle项目中加入JNI so文件
  5. 【VBA】复制单元格数据有效性
  6. linux标准输入输出错误输出
  7. IIS相关知识和经验的碎皮化记录
  8. 正则化--L2正则化
  9. svn client命令
  10. js删除cookie的方法