今天做公司的某个网站前端网页页面的时候笔者又遇到了难解决的网页前端DIVCSS代码问题,一个平时不会发生的怪事情发生了:为网页代码中的Form表单中的input 和 button 按钮标签在CSS样式代码文件中设置了背景图background-image竟然失效不起作用不显示了!笔者查看了这个代码在IE、火狐等各浏览器下的 浏览效果,尽管该代码在DW(DreamWeaver)中显示正常,但是在浏览器中它的背景图片确实没有出现没有显示出来,想了很多解决办法和方案,动用了很多手段,连CSSHACK都用上了,就是不出来了,后来好一顿折腾才搞定,网页前端页面工程师也不好做啊!

原本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;

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

input与button按钮背景图失效不显示的解决办法的更多相关文章

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

    笔者从事网页前端代码页面工程师已有多年,作为一个网页重构人员常常会遇到一些莫名其妙的DIV+CSS(正确的说法是XHTML+CSS)在 IE.FireFox火狐. 谷歌浏览器CHROME.苹果浏览器S ...

  2. button,input type=button按钮在IE和w3c,firefox浏览器区别

    在项目中遇到一个问题,是关于点击button按钮会自动刷新的问题.查阅了资料,做以下的整理: button,input type=button按钮在IE和w3c,firefox浏览器区别如下:当在IE ...

  3. iphone H5 input type="search" 不显示搜索 解决办法

    H5 input type="search" 不显示搜索 解决办法 H5 input type="search" 不显示搜索 解决方法 在IOS(ipad iP ...

  4. input标签和fmt:formatDate 在jsp中同时使用引号解决办法

    input标签和fmt:formatDate 在jsp中同时使用引号解决办法 使用input标签设置默认值value并格式化fmt时间格式处理 格式化前: <input type="d ...

  5. 苹果手机上input的button按钮颜色显示问题

    在苹果手机上的input按钮自带效果,需要加上outline:0px; -webkit-appearance:none; 清除原有样式,同时苹果手机上的input按钮自带圆角需要按需要去掉 input ...

  6. 苹果iphone手机上input的button按钮颜色显示有问题,安卓却没问题

    苹果手机中会如类似上图,安卓却可以按自己写的来显示 解决办法: -webkit-appearance: none; 以上即可,当然样式中可以加上通用的: 通用:input[type=button], ...

  7. Android 学习笔记一 自定义按钮背景图

    入门学到的一些组件都是比较规矩的,但在实际应用中,我们需要更多特色的组件,例如一个简单的Button,所以我们必须要自定义它的属性. 遇到的问题:用两张图片来代替按钮,分别表示点击前后 解决方法:用I ...

  8. CSS背景100%平铺 浏览器缩小背景显示不全解决办法

    本文我们分享前端CSS背景100%平铺,浏览器缩小背景显示不全bug解决的两个方法,如果你也遇到了,那么就可以参考下面文章. 把浏览器的窗口缩小时,拖动滚动条时你会发现原本设定的CSS背景100%平铺 ...

  9. IOS的Safari浏览器中,点击事件失效的原理及解决办法

    这里做了事件委托,简单区分一下[目标元素]和[代理元素],为后续论述理解做铺垫. [目标元素]:实际希望点击的元素,可以是任意标签. [代理元素]:代替[目标元素]触发点击事件的元素,有可能是目标元素 ...

随机推荐

  1. linux shell-syntax error near unexpected token错误

    在windows下用记事本编写linux shell脚本后,执行遇到syntax error near unexpected token错误 问题原理:网上找了好久,找到原因,原来是回行的问题,每个系 ...

  2. TextView & EditText

    TextView 1.下划线 textView.getPaint().setFlags(Paint. UNDERLINE_TEXT_FLAG ); //下划线 2.单独做第一步,文字会出现锯齿,要加下 ...

  3. [iOS基础控件 - 1] UI概念

    A. UIView 1.概念      属于UIKit框架      屏幕上能看得见摸得着的东西就是UIView,比如屏幕上的按钮.文字.图片      翻译为:视图/控件/组件      UIBut ...

  4. jquery完成带单选按钮的表格行高亮显示

    jquery完成带单选按钮的表格行高亮显示 上篇博客写的是复选框的,这次写的是单选框的,有时查询的时候,只能选择一条记录,如果将选中的这条记录的行高亮显示,同时该行的单选按钮也被选中了,这样会提高用户 ...

  5. .net MVC全局定时器执行作业

    首先的一个需求是在OA系统中定时跑一些定时作业,例如发放年假等事务,之前的做法是在服务器上加入一个服务,用系统定时作业去跑服务,这样有个问题就是当系统在发布的过程中,有可能忘记启动服务而导致无法定时执 ...

  6. 使用jdbc连接上oracle的两种方法

    1. 使用thin连接 优点:thin驱动都是纯Java代码,并且使用TCP/IP技术通过java的Socket连接上Oracle数据库,所以thin驱动是与平台无关的,无需安装Oracle客户端,只 ...

  7. IDF实验室-简单编程-字符统计 writeup

    题目地址:http://ctf.idf.cn/index.php?g=game&m=article&a=index&id=37 网站:http://ctf.idf.cn/gam ...

  8. python学习(5)

    python(5)5.1 模块:每个.py文件就是一个模块,多个模块可以放在一个包中,而多个包可以放在更大的包中.表示包A中的asd.py可以这样写:A.asd sys模块:它是python的内建模块 ...

  9. Redis实战之征服 Redis + Jedis + Spring (二)

    不得不说,用哈希操作来存对象,有点自讨苦吃! 不过,既然吃了苦,也做个记录,也许以后API升级后,能好用些呢?! 或许,是我的理解不对,没有真正的理解哈希表. 相关链接: Redis实战 Redis实 ...

  10. Android 编程下 java.lang.NoClassDefFoundError: cn.jpush.android.api.JPushInterface 报错

    使用了极光推送的 jar 包项目在从 SVN 中检出后,假设不又一次对 jar 包和 Bulid Path 进行配置就会抛出 java.lang.NoClassDefFoundError: cn.jp ...