这两天被一个CSS问题纠结了很久,代码很简单,就是写一个有收起功能的分隔栏:
<div id="splitbar" class="expand" onclick="foldMenu();"></div>
当收起的时候,splitbar的class="fold",CSS如下:
#splitbar.expand{
....
background-image:url(arrow.gif);
background-position:1px center;
background-repeat:no-repeat;
}
#splitbar.fold{
....
background-image:url(arrow.gif);
background-position:-10px center;
background-repeat:no-repeat;
}
可是不知为什么,用IE查看,当样式为fold时,样式一直加载不了(用IE插件看样式确实没起作用),而用FF等其他浏览器查看是好的。由于我用的是IE6,于是今天借同事电脑看了下,发现IE8下显示也没问题,基本确定是IE6的问题。
后来我把expand和fold的样式换了下位置,把fold放在前面,发现fold的样式加载进来了,expand却无效了,我考虑了一下,估计和样式前面加上元素ID做限制有关,可能是IE6下面,用ID做了限制后,先定义的样式会把后面的样式阻栏。于是我把"#splitbar"去掉,问题果然就解决了。
分享到:
相关推荐
"CSS样式在IE6下无效的问题解决方法"这个标题提示我们,这里主要涉及的是CSS在IE6下无法正常应用的问题,其核心在于编码格式的不匹配和中文注释的影响。 首先,我们要理解问题的症状。当你通过`<link>`标签引用一个...
本文将深入探讨CSS在IE6下无法正常工作的原因,以及如何解决这些问题。 首先,IE6对CSS2标准的支持并不完全,尤其是一些重要的布局特性,如浮动、定位和盒模型。IE6中的盒模型错误是导致许多布局问题的根源。默认...
本文将深入探讨如何解决CSS在IE与Firefox下的兼容问题,帮助你的网页在各种浏览器中展现一致的效果。 1. **认识浏览器渲染差异** - **DOCTYPE声明**:DOCTYPE声明会影响浏览器进入何种标准模式。在IE中,没有...
在网页开发中,CSS样式兼容问题是一个长期困扰开发人员的难题。不同的浏览器,尤其是Internet Explorer(IE)和Mozilla Firefox,由于对W3C标准的支持程度不同,会导致同一份CSS样式表在各个浏览器中呈现出截然不同...
尤其是在处理旧版Internet Explorer(如IE6、IE7、IE8)与现代浏览器(如Firefox、Chrome等)之间的样式差异时,CSS Hack技巧成为了必不可少的工具。本文将深入探讨不同浏览器兼容性的CSS Hack代码及其实例,帮助...
另外,IE6没有实现CSS2中的很多新特性,例如:伪类选择器(:hover, :active, :focus)只对链接生效,而对其他元素无效。再者,IE6的盒模型错误是著名的,它将边框和内填充算入元素宽度,与W3C标准不符,给布局带来很...
这份“IE6 -- IE8浏览器CSS兼容性查询手册”就是为了解决这样的问题而生。 CSS是网页设计中用于控制布局和样式的语言,它使得我们可以将内容和表现分离,提高网页的可维护性和可访问性。但遗憾的是,IE6、IE7和IE8...
在网页开发过程中,尤其是在兼容IE浏览器的时候,开发者经常会遇到一些棘手的问题,其中之一就是CSS样式的`height`属性在IE中失效。这个问题在标题和描述中已经提及,主要是指在Internet Explorer(IE)浏览器中,...
- 兼容性问题:并非所有CSS3属性都能被ie-css3.htc支持,且仅适用于IE6-8,对IE9及以上版本无效。 - 移动端不适配:ie-css3.htc主要是为桌面浏览器设计的,对于移动设备或触摸交互的支持有限。 4. **替代方案**:...
这些CSS文件可以重置所有浏览器的默认样式,使各浏览器的样式起点一致,减少因默认样式差异导致的问题。 6. 测试工具与策略: 使用BrowserStack或CrossBrowserTesting等在线工具进行跨浏览器测试,确保代码在多种...
在网页设计中,CSS(层叠样式表)的浏览器兼容性问题是一大挑战,尤其是在处理老版本的浏览器,如IE6、IE7时。不同浏览器对CSS的理解和解析方式存在差异,导致样式在不同浏览器中可能表现不一致。本文将详细介绍如何...
它通过JavaScript模拟了这些新元素的CSS样式渲染,使得开发者可以在IE6中使用如, , 等新标签。 2. **Modernizr**: Modernizr是一个JavaScript库,用于检测浏览器对HTML5和CSS3特性的支持情况。它可以让你知道哪些...
以下是关于"IE6下PNG背景透明的方法"的详细解释: 1. **CSS滤镜法**:这是最基础的解决方式,利用CSS中的`filter`属性。对于PNG8格式的图片,可以使用`filter:progid:DXImageTransform.Microsoft.AlphaImageLoader...
3. **背景渐变(Background Gradient)**: 使用CSS3的linear-gradient或radial-gradient创建的背景渐变在IE6-9中无效。Selectivizr通过创建多个背景图像并调整它们的位置来模拟渐变效果。 4. **盒阴影(Box Shadow...
但需要注意的是,这种方法可能在某些情况下无效,尤其是在IE6_0和IE7_0中,可能需要额外的调整来达到理想的效果。 #### 7. Cursor属性的兼容性 `cursor:pointer`在IE6_0和IE7_0中显示为手形指针,而在FireFox中...
7. **脚本设置样式无效**: 在XHTML1/DTD中,JavaScript动态设置样式时也需要指定单位。例如,`document.getElementById("x").style.height="200"`在Firefox中无效,应更改为`document.getElementById("x").style....
其中自定义样式表方式有一键配置bat,用起来很简单,将DisableIEScaleOnDClick.bat复制到合适的用于保存css样式表的目录,然后运行即可, 运行完毕后可将DisableIEScaleOnDClick.bat删除,但css文件不能删,删了就...
掌握这些技巧和解决方案,能够帮助开发者更有效地处理CSS在不同浏览器间的兼容性问题,确保网站在各种环境下都能正常显示。随着浏览器更新和CSS规范的统一,这些问题逐渐减少,但了解它们仍然对维护旧项目或支持较旧...