input与button按钮背景图失效不显示的解决办法
今天做公司的某个网站前端网页页面的时候笔者又遇到了难解决的网页前端DIVCSS代码问题,一个平时不会发生的怪事情发生了:为网页代码中的Form表单中的input 和 button 按钮标签在CSS样式代码文件中设置了背景图background-image竟然失效不起作用不显示了!笔者查看了这个代码在IE、火狐等各浏览器下的 浏览效果,尽管该代码在DW(DreamWeaver)中显示正常,但是在浏览器中它的背景图片确实没有出现没有显示出来,想了很多解决办法和方案,动用了很多手段,连CSSHACK都用上了,就是不出来了,后来好一顿折腾才搞定,网页前端页面工程师也不好做啊!
原本CSS代码如下:
background-repeat: no-repeat;
后来经过不断调试和探索,最终发现 只需加以下2行代码便可以解决CSS中设置了按钮背景图,但是浏览器中背景图失效不显示的网页前端代码兼容性问题:
background-repeat: no-repeat;
background-color: transparent;//关键就是将背景色设置为透明,好让背景图显示出来。这个代码在DW的IDE环境下是没有的,需要你手动输入这种背景颜色透明的CSS代码
border:none;
最后看看呗[kankanbei.com]总结为:外部CSS代码中有某一处设置的属性导致此处按钮的原背景无法去掉,进而导致背景图片失效没显示。另外一种解决就是使用A标签来替代这些input和button标签。
input与button按钮背景图失效不显示的解决办法的更多相关文章
- 遭遇input与button按钮背景图失效不显示的解决办法
笔者从事网页前端代码页面工程师已有多年,作为一个网页重构人员常常会遇到一些莫名其妙的DIV+CSS(正确的说法是XHTML+CSS)在 IE.FireFox火狐. 谷歌浏览器CHROME.苹果浏览器S ...
- button,input type=button按钮在IE和w3c,firefox浏览器区别
在项目中遇到一个问题,是关于点击button按钮会自动刷新的问题.查阅了资料,做以下的整理: button,input type=button按钮在IE和w3c,firefox浏览器区别如下:当在IE ...
- iphone H5 input type="search" 不显示搜索 解决办法
H5 input type="search" 不显示搜索 解决办法 H5 input type="search" 不显示搜索 解决方法 在IOS(ipad iP ...
- input标签和fmt:formatDate 在jsp中同时使用引号解决办法
input标签和fmt:formatDate 在jsp中同时使用引号解决办法 使用input标签设置默认值value并格式化fmt时间格式处理 格式化前: <input type="d ...
- 苹果手机上input的button按钮颜色显示问题
在苹果手机上的input按钮自带效果,需要加上outline:0px; -webkit-appearance:none; 清除原有样式,同时苹果手机上的input按钮自带圆角需要按需要去掉 input ...
- 苹果iphone手机上input的button按钮颜色显示有问题,安卓却没问题
苹果手机中会如类似上图,安卓却可以按自己写的来显示 解决办法: -webkit-appearance: none; 以上即可,当然样式中可以加上通用的: 通用:input[type=button], ...
- Android 学习笔记一 自定义按钮背景图
入门学到的一些组件都是比较规矩的,但在实际应用中,我们需要更多特色的组件,例如一个简单的Button,所以我们必须要自定义它的属性. 遇到的问题:用两张图片来代替按钮,分别表示点击前后 解决方法:用I ...
- CSS背景100%平铺 浏览器缩小背景显示不全解决办法
本文我们分享前端CSS背景100%平铺,浏览器缩小背景显示不全bug解决的两个方法,如果你也遇到了,那么就可以参考下面文章. 把浏览器的窗口缩小时,拖动滚动条时你会发现原本设定的CSS背景100%平铺 ...
- IOS的Safari浏览器中,点击事件失效的原理及解决办法
这里做了事件委托,简单区分一下[目标元素]和[代理元素],为后续论述理解做铺垫. [目标元素]:实际希望点击的元素,可以是任意标签. [代理元素]:代替[目标元素]触发点击事件的元素,有可能是目标元素 ...
随机推荐
- ACCESS-如何多数据库查询(跨库查询)
测试通过:ACCESSselect * from F:\MYk.mdb.tablename说明:1.查询语句2.来原于哪(没有密码是个路径)3.查询的表名 ====================== ...
- Go语言 字符串
在所有编程语言中都涉及到大量的字符串操作,可见熟悉对字符串的操作是何等重要. Go中的字符串和C#中的一样(java也是),字符串内容在初始化后不可修改. 需要注意的是在Go中字符串是有UTF-8编码 ...
- Widget only supports Widgets as children
Widget only supports Widgets as children https://www.baidu.com/s?wd=Widget%20only%20supports%20Widge ...
- oracle下的OVER(PARTITION BY)函数介绍
转自:http://www.cnblogs.com/lanzi/archive/2010/10/26/1861338.html OVER(PARTITION BY)函数介绍 开窗函数 ...
- Attribute特性验证模型model
数据验证我们往往分为前台验证和后台验证,而我们的后台验证每到一个方法中就要去验证一次,这样的代码想想都难以维护,这篇我们这篇文章就是为了解决这样的问题.用attribute 这个特性来解决这样的问题 ...
- Jsp中的pageContext对象
这个对象代表页面上下文.组要用于访问页面共享数据.使用pageContext可以直接访问request,session,application范围的属性,看看这些jsp的页面: JSP 页面使用 pa ...
- Spring ProxyFactory
ProxyFactory 是 Spring AOP的实现方式之一.下面介绍下ProxyFactory的用法. 1.接口定义 public interface UserReadService { pub ...
- cocos2d-x UserDefault
转自:http://blog.csdn.net/yanghuiliu/article/details/6912612 正在做项目中有很多游戏数据要保存,常见的玩家数据这些比较简单的可以用CCUserD ...
- linux提权总结(外文)
Before starting, I would like to point out - I'm no expert. As far as I know, there isn't a "ma ...
- BZOJ 1151 傲娇的人 排序
傲娇的人 Time Limit: 1 Sec Memory Limit: 256 MB 题目连接 http://acm.uestc.edu.cn/#/problem/show/1151 Descrip ...