IE6,IE7,IE8 css bug搜集及浏览器兼容性问题解决方法汇总

2020-05-11 08:05:19易采站长站整理

</div>

其大概原理为:第一个alert_blank容器,display:inline以后作为行内元素,它的高度为100%,宽度却为0,相当于紧贴外层容器左边框的一条透明的线,这样就使得外层容器里面只存在一行。外层容易的vertical-align:middle使得其内部相当于一行文字垂直居中。真正盛放内容的div也是display:inline,它对外和blank垂直居中,只要内部文字不超过blank的高度,这个效果将是完美的。虽然从语义化上讲,用空白div布局说不太过去,但是瑕不掩瑜。另:zoom:1是为了触发hasLayout。
31:关于flash遮盖div浮动层
(a) place Flash embed script in <div> container (I use SWFObject.js)[将flash嵌入脚本放到一个div容器中]
(b) add wmode=transparent to Flash embed script[增加wmode=transparent 到flash嵌入脚本]
(c) set <div id="flashcontent"> container with z-index:-1; [将外层容器的z-index设置为-1]
(d) set <body> tag with style .. position:relative;left:0px;top:0px;z-index:0;
(otherwise Firefox does not accept negative z-index)
(e) set floating iframe in container with z-index: 99;[将浮动的iframe在容器中的zindex设置为99]
(f) use CSS to position flashcontent and htmlcontent containers.[使用css来调整flash容器和html容器的位置]
其他方案网上比较多见,不做阐述.在此说下使用第一个方案如何解决:
var so = new SWFObject("XXX.swf", "flashId", "宽度", "高度", "版本", "背景色");
//设置flash不遮盖div层
so.addParam("wmode", "opaque");
so.write("flashcontent");
如此设置即可让flash无法遮盖住div
32:如何处理ie6的文字行高
ie6下汉字就会显示偏上位置,而在标准浏览器中不存在这个问题字体 Tahoma,试下
不过如果有规定第一个字体是用啥的,那就只能忽略这个问题..我终于明白淘宝为啥把Tahoma字体放到第一位了


<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>
<html xmlns=”http://www.w3.org/1999/xhtml”>
<head>
<meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″ />
<title>测试ie6的文字行高表现</title>
<style type=”text/css”>
body,ul,li,p {margin:0;padding:0;}
body { font:12px/1.5 Tahoma,”宋体”,Arial, Helvetica, sans-serif; }
ul {float:left;list-style:none; margin-bottom:10px;}
ul li, p { margin-top:4px;background:silver;clear:left;}
ul li {float:left;margin-top:4px;}
</style>
</head>
<body>
<ul>
<li>岁月不饶人哪</li>
<li>hjgt</li>