div高度和宽度
合作伙伴的添加
Rows2栏目的修改(360的)
产品字体的添加
ie5中对padding值怎么判断
如IE6中样式 :
width{width:620px; height:28px; background:url(images/search.gif); padding-left:158px;}
ie5中怎么写呀
谢谢
在线等
----------------------------------------------------------------------
ie5中的宽度
width=620+158
--------------------------------------------------------
width:620px;*width:620-158px
width:620px!important;width:620-158px
--------------------------------------------------------
谢谢了
padding的问题,不同版本结果不同 2010-07-28 19:01 转自
CSS布局宽度:margin和padding 真实宽度问题【总结】
2010-07-23 15:29
昨天开始一直在探讨DIV+CSS布局在IE5,IE6,IE7,IE8,360,FireFox浏览器下的一些问题:
一起来看一个宽度问题,为了一目了然,我举了列子,通过列子,可以清楚的看到区别:
IE 6 ,Firefox ,Opera等
真实宽度=width+padding+border+margin
IE5
真实宽度=width-padding-border
很明显,第一种下很完美的布局在第二种情况下后果是很凄惨的~
不用着急,今天我们就解决这个问题:
首先了解一个概念:
width:280px !important; //这个是正确的width书写方法,请这样写清楚;而width(空格)/**/:300px; //IE6等浏览器/win不解析这句,所以IE6/win仍然认为width的值是280px;而IE5.X/win读到这句,新的数值(300px)覆盖掉了旧的,因为!important标记对他们不起作用。这样就OK了。
现在我们看实例:
【padding布局宽度】
【解释】在IE6,IE7,IE8,FF等浏览器直接获取实际/内容宽度middle280px,真实宽度计算:280PX+10PX+10PX=300PX;
IE5实际/内容宽度是middle280PX;真实宽度计算:320PX-10PX-10PX=300PX;(以下不再说明)
你可能觉得有点绕,没关系,你只要记住IE5宽度书写方式:width(空格)/**/:300px;其他浏览器书写方式:width:280px!important; 这两个宽度之间的差值就是你定义的Padding +
border 总大小(以下会验证);
学习的最好方法是自己调试,用不同的值去调试,这样你的记忆会更深刻~
【margin布局宽度】
left
middle
IE6,IE7,IE8,FF等:300PX-border 20px=280PX;
IE5: 280PX(IE6...)+border 20px=300px;
【margin + border】
IE6,IE7,IE8,FF等:300PX-margin 20px - border 20px=260PX;
IE5: 260PX(IE6...)+border 20px=280px;
【margin + border + padding】
IE6,IE7,IE8,FF等:300PX-margin 20px - border 20px - padding 20px=240PX;
IE5: 240PX(IE6...)+border 20px+padding 20px=280px;
【border + padding】
IE6,IE7,IE8,FF等:300PX-border 20px - padding 20px=260PX;
IE5: 260PX(IE6...)+border 20px + padding 20px=300px;
【margin + padding 】
本文档为【div高度和宽度】,请使用软件OFFICE或WPS软件打开。作品中的文字与图均可以修改和编辑,
图片更改请在作品中右键图片并更换,文字修改请直接点击文字进行修改,也可以新增和删除文档中的内容。
[版权声明] 本站所有资料为用户分享产生,若发现您的权利被侵害,请联系客服邮件isharekefu@iask.cn,我们尽快处理。
本作品所展示的图片、画像、字体、音乐的版权可能需版权方额外授权,请谨慎使用。
网站提供的党政主题相关内容(国旗、国徽、党徽..)目的在于配合国家政策宣传,仅限个人学习分享使用,禁止用于任何广告和商用目的。