最近遇到了些小bug,在这里做个记录分享下。低版本的浏览器不支持新属性或者说对代码的解析方式不一样,导致最后解析出来的结果五花八门,各种浏览器之间的兼容的确是一个令开发人员头疼的事情,不过有时候换一个思路去写也许能避免许多hack,不管是js hack还是css hack始终都是不推荐的,能避免则避免。

  先分享一篇别人总结的 css hack方式,比较齐全,感谢原博主。http://blog.csdn.net/freshlover/article/details/12132801

我的问题描述:background背景设置在IE8及以下显示不正常

这个也不算是啥bug,应该说是我自己写法不规范造成的。

 <!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>你还起作用吗</title>
<style>
div{
width: 200px;
height: 200px;
background: #5ea593 url(.jpg) no-repeat;
}
</style>
</head>
<body>
<div></div>
</body>
</html>

这样写的方式,注意:在url和0之间没有空格隔开,在ie9+是没有问题的,但是在ie8及以下是不正常的。开始这个问题困扰了我好久,不知道哪出了问题。后来找到原因了真是恨死自己了。

解决:background: #5ea593 url(2.jpg) 0 0 no-repeat;在url和0之间用空格隔开。

所以啊,以后写代码务必要规范!规范!不然有可能会花很多时间去做无用功。

(一)IE8以下background不起作用的更多相关文章

  1. 真~让IE8支持background: rbga; ,IE8下兼容rgba颜色的半透明背景

    IE8下兼容rgba颜色的半透明背景 这样的标题在百度和google搜索下很多篇文章,讲解IE8下兼容rgba的. 这些文章全部都是使用IE下的filter来使元素透明,但是这个里面会有bug. 它们 ...

  2. IE8中伪元素动态作用样式不重绘bug记录

    前阵子对公司框架的前端优化中,使用了字体图标(iconfont)来做模块的图标集,供用户进行配置选择. 字体图标的有非常好的灵活性和复用性,可以像处理文字一样通过font-size进行大小设置.通过c ...

  3. background:transparent的作用

    background的属性值 background : background-color | background-image | background-repeat | background-att ...

  4. 环境:win7+ie8 IE8的F12不起作用,原因如下:

    1.先按下F12 2.再按下CTL+P,此时调试框将出现在屏幕下方. 3.再次点击CTL+P 4.此时在任务栏上的到IE8的图标,将会看到调试框,右击最大化,此时调试框是最大化状态. 5.然后再慢慢的 ...

  5. ie8中遇到的兼容问题以及解决方案

    一.CSS3 1.可以通过在css中引入pie.htc,处理兼容问题(可处理的属性) -webkit-box-shadow: 0 1px 5px #ff2826; -webkit-border-rad ...

  6. jQuery.Ajax IE8,9 无效(CORS跨域)

    今天在开发网站的时候,发现一个问题,$.ajax()在 IE8,9 浏览器不起作用,但 Chrome,Firefox ,360,IE10以上等浏览器却是可以的,网上资料很多,查询最后发现是 IE8,9 ...

  7. 网页重构中区分IE6、IE7、IE8及标准浏览器的最佳方法

    由于万恶的IE6和IE7,我们在页面重构时不免要对其进行各种bug修复及差异化处理.在标准浏览器中可实现的效果在IE里却有各种离奇问题,例如IE6.IE7不能良好应对的inline-block和.cl ...

  8. background 设置文本框背景图

    background 属性的作用是给元素设置背景,它是一个复合属性,常用的子属性如下: background-color 指定元素的背景颜色. background-image 指定元素的背景图像. ...

  9. css常用样式背景background如何使用

    css背景background属性常用于定义HTML的背景,background简写属性作用是将背景属性设置在一个声明中,background背景属性常见为以下这些:.background-color ...

随机推荐

  1. 鸽巢原理应用-分糖果 POJ 3370 Halloween treats

    基本原理:n+1只鸽子飞回n个鸽笼至少有一个鸽笼含有不少于2只的鸽子. 很简单,应用却也很多,很巧妙,看例题: Description Every year there is the same pro ...

  2. 普通的年轻状态机,纯C语言

    我们第一次接触到了状态机.在数字电路课程.计数器.串行奇偶校验.考了1连续报错电路 等待,两者都需要一个状态机模型.电路实现这些功能,与状态机的状态转移图.状态转移表是等价. 后.然后,我们联系了状态 ...

  3. 简说一下coffeescript的constructor是如何导致Backbone.View的事件无法正常工作的.

    在继承方面,js还是弱项呀.发现在继承的时候constructor和initialize之分.网上文章没有说明二者关系.看了源码才发现二者的区别呀. 首先我用coffeescript来实现js的继承, ...

  4. hdu1520 (树形dp)

    hdu1520 http://acm.hdu.edu.cn/showproblem.php?pid=1520 题意是给定一棵树,每个结点有一个价值,要我们选择任意个结点使得总价值最大,规则是如果父亲结 ...

  5. erlang shell表格数据对齐

    近期在erlang shell做一些測试,为了让測试结果数据显得更直观,想对齐须要打印的数据,做成像表格一样的效果. 開始的想法是在数据中插入tab. 当然,erlang也有对tab的支持,但实际效果 ...

  6. java序列化是什么和反序列化和hadoop序列化

    1.什么是序列化和系列化DE- 神马是序列化它,序列化是内存中的对象状态信息,兑换字节序列以便于存储(持久化)和网络传输.(网络传输和硬盘持久化,你没有一定的手段来进行辨别这些字节序列是什么东西,有什 ...

  7. 解决 下载 CM-12.0 源代码出现 Fatal: duplicate project .....问题

    在使用 repo init -u git://github.com/CyanogenMod/android.git -b cm-12.0 初始化代码库的时候出现如下错误: fatal: manifes ...

  8. 重新想象 Windows 8 Store Apps (21) - 动画: ThemeTransition(过渡效果)

    原文:重新想象 Windows 8 Store Apps (21) - 动画: ThemeTransition(过渡效果) [源码下载] 重新想象 Windows 8 Store Apps (21) ...

  9. gradle下载(转)

    http://services.gradle.org/distributions services.gradle.org/ distributions/ gradle-2.2.1-rc-1-all.z ...

  10. 打开 chm 帮助文件显示空白及解决方法

    有个很奇葩的解决方法:把 chm 文件用压缩软件压缩,然后用压缩软打开此压缩包,直接双击压缩包里面的 chm 文件 这虽然解决了问题,但是这不科学…… 分析:直接打开压缩包里面的文件,压缩包的文件是临 ...