2012年7月13日星期五

input与button按钮背景图失效不显示的解决办法

原本CSS代码如下:

 background-image: url(images/kankanbei.jpg);
 background-repeat: no-repeat;

后来经过不断调试和探索,最终发现 只需加以下2行代码便可以解决CSS中设置了按钮背景图,但是浏览器中背景图失效不显示的网页前端代码兼容性问题:

 background-image: url(images/kankanbei.jpg);
 background-repeat: no-repeat;
 background-color: transparent;//关键就是将背景色设置为透明,好让背景图显示出来。这个代码在DW的IDE环境下是没有的,需要你手动输入这种背景颜色透明的CSS代码
 border:none;

总结为:外部CSS代码中有某一处设置的属性导致此处按钮的原背景无法去掉,进而导致背景图片失效没显示。另外一种解决就是使用A标签来替代这些input和button标签。