上一篇
下一篇
css常见问题解决办法收集
作者:admin 日期:2008-12-21
一、IE6的双倍边距BUG
例如:
<style type="text/css">
body {margin:0;}
div {float:left; margin-left:10px; width:200px; height:200px; border:1px solid red;}
</style>
浮动后本来外边距10px,但IE解释为20px,解决办法是加上display:inline
二、为什么FF下文本无法撑开容器的高度？
标准浏览器中固定高度值的容器是不会象IE6里那样被撑开的,那我又想固定高度，又想能被撑开需要怎样设置呢？办法就是去掉height设置min-height:200px; 这里为了照顾不认识min-height的IE6 可以这样定义：
三、怎么样才能让层显示在FLASH之上呢？
解决的办法是给FLASH设置透明:
<a href="http://www.easyq.net.cn/">:</a>
<pre lang="html" line="1">
<param name="wmode" value="transparent" />
四、怎样使一个层垂直居中于浏览器中？
这里使用百分比绝对定位，与外补丁负值的方法，负值的大小为其自身宽度高度除以二
五、关于IE6样式中背景图片不缓存的BUG
示例：
a{ background:url(images/normal.gif); } a:hover { background:url(images/hover.gif); }
如果为超级链接定义上述的css样式以实现鼠标悬浮时的动态效果，在firefox下是没有什么问题的，第一次加载之后，浏览器都会从缓存读取背景图片；
而IE6在这里有一个bug，它每次都从服务器端读取背景图片，结果就是，若服务器反应较慢hover效果就会出现短暂的空白，令人极度不爽。 一直以来都是通过“两张背景图片合并、background-postion控制位置”的方式解决问题的，效果差强人意。
具体来说就是在页面中加入一段简单的javascript脚本，告诉ie6：本地有背景图片的话就不要麻烦服务器了。 document.execCommand("BackgroundImageCache",false,true);
关于这段脚本的放置方式有两种：
1.用CSS，在css中加入如下代码
html {}{ filter: expression(document.execCommand("BackgroundImageCache", false, true)); }
2.用JS：document.execCommand("BackgroundImageCache",false,true);
如下：
例如:
复制内容到剪贴板
程序代码
程序代码<style type="text/css">
body {margin:0;}
div {float:left; margin-left:10px; width:200px; height:200px; border:1px solid red;}
</style>
浮动后本来外边距10px,但IE解释为20px,解决办法是加上display:inline
二、为什么FF下文本无法撑开容器的高度？
标准浏览器中固定高度值的容器是不会象IE6里那样被撑开的,那我又想固定高度，又想能被撑开需要怎样设置呢？办法就是去掉height设置min-height:200px; 这里为了照顾不认识min-height的IE6 可以这样定义：
复制内容到剪贴板 程序代码
程序代码div { height:auto!important; height:200px; min-height:200px; }
三、怎么样才能让层显示在FLASH之上呢？
解决的办法是给FLASH设置透明:
复制内容到剪贴板 程序代码
程序代码<a href="http://www.easyq.net.cn/">:</a>
<pre lang="html" line="1">
<param name="wmode" value="transparent" />
四、怎样使一个层垂直居中于浏览器中？
复制内容到剪贴板 程序代码
程序代码<style type="text/css">
<!--
div {
position:absolute;
top:50%;
left:50%;
margin:-100px 0 0 -100px;
width:200px;
height:200px;
border:1px solid red;
}
-->
</style>
<!--
div {
position:absolute;
top:50%;
left:50%;
margin:-100px 0 0 -100px;
width:200px;
height:200px;
border:1px solid red;
}
-->
</style>
这里使用百分比绝对定位，与外补丁负值的方法，负值的大小为其自身宽度高度除以二
五、关于IE6样式中背景图片不缓存的BUG
示例：
复制内容到剪贴板 程序代码
程序代码a{ background:url(images/normal.gif); } a:hover { background:url(images/hover.gif); }
如果为超级链接定义上述的css样式以实现鼠标悬浮时的动态效果，在firefox下是没有什么问题的，第一次加载之后，浏览器都会从缓存读取背景图片；
而IE6在这里有一个bug，它每次都从服务器端读取背景图片，结果就是，若服务器反应较慢hover效果就会出现短暂的空白，令人极度不爽。 一直以来都是通过“两张背景图片合并、background-postion控制位置”的方式解决问题的，效果差强人意。
具体来说就是在页面中加入一段简单的javascript脚本，告诉ie6：本地有背景图片的话就不要麻烦服务器了。 document.execCommand("BackgroundImageCache",false,true);
关于这段脚本的放置方式有两种：
1.用CSS，在css中加入如下代码
html {}{ filter: expression(document.execCommand("BackgroundImageCache", false, true)); }
2.用JS：document.execCommand("BackgroundImageCache",false,true);
如下：
复制内容到剪贴板 程序代码
程序代码<!--[if IE 6]>
<script>
document.execCommand("BackgroundImageCache", false, true);
</script>
<![endif]-->
<script>
document.execCommand("BackgroundImageCache", false, true);
</script>
<![endif]-->
文章来自: 
引用通告: 
Tags: 
相关日志:
评论: 0 | 引用: 0 | 查看次数: 891
发表评论
