<div></div>
<div style=”position:relative; z-index:1;”>
<div style=”position:relative; z-index:1000;”>
<div style=”position:absolute; z-index:9999;”>
<img src=”http://image.zhangxinxu.com/image/study/s/s256/mm3.jpg” />
</div>
</div>
</div>
结果IE6童鞋喜笑颜开,春光灿烂:
19:css reset中的list-style:none
在IE6,7下,当UL不具有float:left;display:inline;时:无论有没有list-style:none这个属性,列 表符都被隐藏,不占位置(下面代码中的5,6)当UL具有float:left;display:inline;属性时list- style:none,列表符被隐藏,但是仍然留有位置(list-style-position:inside);未 设置list-style:none;列表符被隐藏,也不占位(list-style-position:outside)在firefox中只要list-style-type为none ,则 无论list-stype-position的值为outside或inside , list-style都能很好的被隐藏而在IE6,7中,仅 设置list-style:none,并不足以解决所有问题所以我认为在css reset的时候使用 list-style:none outside none 更好
20:链接去边线(完全兼容)
a,a:hover{outline:none; blur:expression(this.onFocus=this.blur());}
21: display:inline-block 额外产生的6PX 或者4px margin
今天在做一个Timeline的模块的时候遇到一个棘手的问题: 给元素添加display:inline-block 属性的时候会产生额外的4px的margin-right。
原始代码
.YP_timelineChart_box li{
display:-moz-inline-stack;
display:inline-block;
zoom:1;
*display:inline;
text-indent:-3000px;
width:5px;
vertical-align:bottom;
background-color:#00FF00;
position:relative;
}
页面渲染结果:
每一列都会向右产生外边距4px,苦思不得其解,尝试负的外边距,但是涉及到其他的问题:每个li标签会重叠1-2个px,妨碍到鼠标hover状 态的事件。尝试修改doctype类型也不见效果。后来尝试了另外一个方法:把原来的HTML 代码结构:更改为:这样就不会产生额外的外边距,也弄不清楚为什么会出现这种问题。先暂时记下,以后再研究研究。
22: IE6中伪类:hover的使用及BUG
以前未曾遇到类似的问题,一番google,才知道这是IE6处理CSS伪类:hover的Bug。例如如下的代码:
<style>
a {color: #333;}
a span {color: green;}
a:hover {}
a:hover span {color: red; }
</style>
<a href=”http://www.taobao.com“> 淘宝网 <span> 淘你喜欢 </span></a>
在IE7/FF中,鼠标移动到链接上时,”淘你喜欢”字样会变为红色,但IE6则无反应。所以IE6的bug就是如果a 与 a:hover 的css定义是一样的,也就是说如果a:hover 中没有样式的改变,hover就不会被触发。但如果在a:hover{}增加一些特定的属性,例如










