易截截图软件、单文件、免安装、纯绿色、仅160KB

css在IE、火狐下的兼容问题


 
DIV+CSS网页布局这是一种趋势,我也开始顺应这股趋势了,不过在使用DIV+CSS网站设计的时候,应该注意css样式兼容不同浏览器问题,特别是对完全使用DIV CSS设计的网页,就应该更注意IE6、IE7、FF对CSS样式的兼容,不然,你的网页可能乱的一塌糊涂!我经常被这些东西整的焦头烂额,于是呼在网上找了些资料,加上自己的理解和这些日子的经验,整理了一些资料,其中有一些我还没用到的和还不能理解的,就直接从别的地方给粘了过来, 不知道有没有错误,等我以后用到的时候慢慢改吧,希望对大家有点帮助!--好经验共享交流网
什么是浏览器兼容:当我们使用不同的浏览器(Firefox IE7 IE6)访问同一个网站,或者页面的时候,会出现一些不兼容的问题,在这种浏览器下显示正常,在另一种下就乱了,我们在编写CSS的时候会很恼火,刚修复了这个浏览器的问题,结果另外一个浏览器却出了新问题。好吧,我服了行吧,那我就利用你们的不兼容各写一段css,让他们各执行各的,这下总该你没脾气了吧,呵呵。
好了,言归正传
最佳解决方案,同一个样式定义3套,针对不同浏览器用,如#wrapper
#wrapper { width: 120px; } /* FireFox */
*html #wrapper { width: 80px;} /* ie6 fixed */
* html #wrapper { width: 60px;} /* ie7 fixed, 注意顺序 */
* html 与 *html 是IE特有的标签,firefox 暂不支持。
而* html 又为 IE7特有标签。
* html 对IE7的HACK 必须保证HTML顶部有如下声明:
程序代码<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
二、万能 float 闭合
关于 clear float 的原理可参见 [How To Clear Floats Without Structural Markup]
将以下代码加入Global CSS 中,给需要闭合的div加上 class="clearfix" 即可,屡试不爽。
程序代码
/* Clear Fix */
.clearfix:after
{
content:".";
display:block;
height:0;
clear:both;
visibility:hidden;
}
.clearfix
{
display:inline-block;
}
/* Hide from IE Mac \*/
.clearfix {display:block;}
/* End hide from IE Mac */
/* end of clearfix */
三、其他兼容技巧
1、FF下给 div 设置 padding 后会导致 width 和 height 增加,但IE不会。(可用!important解决)
2、居中问题。
1) 垂直居中。将 line-height 设置为 当前 div 相同的高度,再通过 vertical-align: middle. (注意内容不要


相关文档:

CSS控制左边固定,右边自由伸展

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style>
.main{position:relative;width:100%}
.left{position:absolute;width:200px;border:solid 1px red; height: ......

css的dl dt dd的应用

css的dl dt dd的应用:
<!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= ......
© 2009 ej38.com All Rights Reserved. 关于E健网联系我们 | 站点地图 | 赣ICP备09004571号