没有合适的资源?快使用搜索试试~ 我知道了~
好久没有处理过IE6下的兼容问题了,今天有朋友碰到过input[type="submit"]和button[type="submit"]在IE6-7下会出现黑边,就算是你在样式中重置了一个border属性也是如此。真是蛋疼的很。后来经过查找相关的资料,终于找到了解决方法,放上来与大家分享一下,这个问题有可能不只一个人会碰到。(^_^) 在介绍如何处理这个bug之间我们一起来回顾一下,在IE6-7下,input[type="submit"]和button[type="submit"]存在的问题还不仅是这个,常见的有:button在IE67下的宽度兼容问题、button的行高问题(各浏览器下解析不
资源详情
资源评论
资源推荐
button在在IE6/7下的黑边去除方案下的黑边去除方案
好久没有处理过IE6下的兼容问题了,今天有朋友碰到过input[type="submit"]和button[type="submit"]在IE6-7下会出现黑边,
就算是你在样式中重置了一个border属性也是如此。真是蛋疼的很。后来经过查找相关的资料,终于找到了解决方法,放上来
与大家分享一下,这个问题有可能不只一个人会碰到。(^_^)
在介绍如何处理这个bug之间我们一起来回顾一下,在IE6-7下,input[type="submit"]和button[type="submit"]存在的问题还不
仅是这个,常见的有:button在IE67下的宽度兼容问题、button的行高问题(各浏览器下解析不一样)、button的outline问
题,甚至submit在ios下也存在问题。这么多烦人的事,苦逼了前端人员。今天就在为大家增加一个问题的解决方案——如何如何
去除去除IE67下按钮的黑边框下按钮的黑边框
问题问题
问题是这样的,你的登录表单中有一个登录按钮,当登录按钮得到焦点,并且消失焦点后,登录按钮会有一个1px的黑色边
框,这样直接影响了页面的效果,但是这样的问题是怎么来的,我也不知道(希望有知道朋友能帮忙解释一下)。而且这样的
bug将出现在下面两个元素上:
button按钮使用了【type="submit"】会产生这样的bug;input使用了【type="submit"】也会产生这样的bug。
一起来看这个问题的截图一起来看这个问题的截图:
解决方案解决方案
要解决这样的bug最好的方法就是在button和input的标签外添加一个标签,然后将样式写在这个标签上,并且把button和input
的默认样式都去除掉,相信不少同学是这样使用的,简单了事。但有的情况下我们是无法为这两个元素添加标签的,那么我们
就需要别的方法来解决。
正常的解决方案是没了,只有使用滤镜来解决正常的解决方案是没了,只有使用滤镜来解决:
复制代码代码如下:
<!–[if IE] >
<style type=”text/css” >
input {
filter:chroma(color=#000000);
}
</style>
<![endif]–>
因为这个问题,存在所有按钮上,为了一劳永逸,建议在reset.css样式中加入:
复制代码代码如下:
input[type=submit],
input[type=reset],
input[type=button]{
filter:chroma(color=#000000);
}
属性选择器在IE下没有得到较好的支持,可以使用类名来代替,比如说“form-text”。
就是这么一句代码,把黑色边框去掉了。
weixin_38648968
- 粉丝: 11
- 资源: 946
上传资源 快速赚钱
- 我的内容管理 展开
- 我的资源 快来上传第一个资源
- 我的收益 登录查看自己的收益
- 我的积分 登录查看自己的积分
- 我的C币 登录后查看C币余额
- 我的收藏
- 我的下载
- 下载帮助
安全验证
文档复制为VIP权益,开通VIP直接复制
信息提交成功
评论0