那些关于IE6的问题

CSS HACK 写法问题:
height:10px;			=>	for all standard explorer
height:8px\o;			=>	only for IE8
*height:7px;			=>	for IE6 & IE7
_height:6px;			=>	only for IE6

IE6浮动问题:

<li><a href="">link to www</a></li>
li{ float:left; }
a{ display:inline-block; }				<!-- 此时,【display:inline-block;】属性是好用的,a元素不能display:block;,否则li不能浮动。 -->

<li><a href=""><img src="" /></a></li>
li{ float:left; }
a{ display:inline-block;width:mmpx; height:mmmpx; }	<!--  要设定宽度和高度以包住图片,否则会很诡异。 -->

IE6定位问题:

<li class="father"><a href="">positon</a>
	<ul class="sun">
		<li><a href="">something to www</a></li>
	</ul>
</li>
.father{ positon:relative; *z-index:999; }<!--ie6中,必须设置父元素【z-index:999】,否则弹出菜单会被其他元素遮盖。 -->
.sun{ position:absolute;z-index:999; }<!--z-index的值只在兄弟节点之间有效,具有强烈的传递性。父容器不可能遮盖子容器。-->
position:absolute; 对 cursor:pointer; 失效,需要加个背景即可。
*background:#fff;  *filter:alpha(opacity:0);
IE6高度及行高问题:

.space2{ height:2px; *font-size:0;*line-height:0; }		/* ie6的最小高度会受到字体和行高的影响。*/

<div>文字</div>			<!-- =》	line-height:45px;   //则DIV高度为45px,且文字居中。
	一个空DIV的高度为0,当DIV中放入文字时高度产生了!为什么呢?是文字的大小把它撑开了吗?
	不是!是文字的line-height行高把DIV撑开了,且line-height使文字具有居中效果!所有浏览器都一样。-->
<div><img src="" />文字</div>
	<!--  当文字和图片混排时,标准浏览器还是一样,
	但是IE6却不认识line-height行高了!-->

文本与图像的居中问题:

浏览器解释有差异,可通过怪异方法解决
<p><a href="#">文字</a><a href="#"><img src="" /></a></p>
img{margin-bottom:-5px;}			//适当调整img元素的这个属性可解决文字与图片的居中问题。兼容性良好。
	

神奇的负margin:

负margin能够拉近元素之间的距离,并影响文档流的后续元素。
而position定位只对本元素有影响。
eastmoney.com的帽子效果!

BOX MODEL:
the BOX MODEL is assist of Margin Border Padding and Content
When you set the width and height properties of an element with CSS,you just aet the width and height of the Content area.
to calculate the full size of an element,you must also add the padding borders and margins.
IE8 and earlier versions of IE,included padding and border in the width property. to fix this problem,add a<!DOCTYPE html>to the HTML page.

文字阴影(相当不好用啊  还是用图片吧):
zoom:1; filter:progid:DXImageTransform.Microsoft.Shadow(Strength=1, Direction=120, color=#f0f);


【text-indent】属性只对【display:block;】的元素有效。

ie6依赖【overflow:hidden;】属性来隐藏超出的内容。

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值