买麦网论坛网建部落设计制作 CSS2盒模型的3D示意图

1  /  1  页   1 跳转页 查看:1533

CSS2盒模型的3D示意图

本主题由 御史 waner01 于 2008-5-9 17:41:35 执行 主题置顶/取消 操作
离线 waner01
头像
古代婉儿

  • 个人空间 相册
  • 组别:御史
  • 性别:
  • 生日:2005-01-01
  • 来自:
  • 积分:531
  • 帖子:382
  • 注册: 2008-04-22
2008-05-05 11:53 | 只看楼主
树型| 收藏| 小 中 大 1

CSS2盒模型的3D示意图

作者：阿捷

CSS2中的盒模型是关系到我们排版定位的关键，例如<div>就遵循盒模型规范。盒模型定义的margin，background-color，background-image，padding ，content，border，初学者经常会搞不清楚它们之间的层次、关系和相互影响。这里提供一张盒模型的3D示意图，希望便于你的理解和记忆。

原图出自：hicksdesign
需要说明的是：IE和Mozilla浏览器对盒模型的解释不一致，造成我们定位上的困难，主要差别是：
  • IE计算2个div之间的距离时候，会把1px的border计算在内，而mozilla没有；
  • 设定div的宽度后，如果给padding加一个值，IE会在宽度内减去这个值，而M ozilla会在宽度基础上加上这个值。
gototop
 
离线 yufeixuan
头像
yufeixuan

  • 个人空间 相册
  • 组别:主薄
  • 性别:
  • 生日:1985-10-25
  • 来自:
  • 积分:14
  • 帖子:6
  • 注册: 2008-05-14
2008-05-14 01:32 |
树型| 收藏| 小 中 大 2

回复：CSS2盒模型的3D示意图

希望以后发表些原创的内容，大家可以相互交流，当然我也并不反对摘抄网络上面的
资源，因为把网络上面的资源集中起来分享给大家也是一笔不小的财富 。
gototop
 
离线 waner01
头像
古代婉儿

  • 个人空间 相册
  • 组别:御史
  • 性别:
  • 生日:2005-01-01
  • 来自:
  • 积分:531
  • 帖子:382
  • 注册: 2008-04-22
2008-05-16 09:08 | 只看楼主
树型| 收藏| 小 中 大 3

回复: CSS2盒模型的3D示意图

谢谢您的建议,我们会尽快添加一些原创内容的,希望以后多多支持
怀着梦想,努力拼搏.抓住机会,不断提高自己!
婉儿博客:http://bbs.www.com.cn/space/?uid=12
gototop
 
<<上一主题|下一主题>>
1  /  1  页   1 跳转页

版权所有 买麦网   Sitemap

京ICP证050062号
返顶部