请选择 进入手机版 | 继续访问电脑版
搜索
房产
装修
汽车
婚嫁
健康
理财
旅游
美食
跳蚤
二手房
租房
招聘
二手车
教育
茶座
我要买房
买东西
装修家居
交友
职场
生活
网购
亲子
情感
龙城车友
找美食
谈婚论嫁
美女
兴趣
八卦
宠物
手机

W3C 标准盒模型和 IE 模型

[复制链接]
查看: 80|回复: 0

2万

主题

2万

帖子

7万

积分

管理员

Rank: 9Rank: 9Rank: 9

积分
76529
发表于 2020-9-16 12:36 | 显示全部楼层 |阅读模式
CSS 中有两种盒模型,分别是 IE 盒模型W3C 标准盒模型
我的关键词 W3C 标准盒模型和 IE 模型  新闻咨询

从上图可以看到标准 W3C 盒模型的范围包括 margin、border、padding、content,并且 content 部分不包含其他部分。
我的关键词 W3C 标准盒模型和 IE 模型  新闻咨询

从上图可以看到 IE 盒子模型的范围也包括 margin、border、padding、content,和标准 W3C 盒模型不同的是:IE 盒模型的 content 部分包含了 border 和 pading。
W3C 标准盒模型
  1. 元素空间占据空间大小元素空间高度 = height + padding-top + padding-bottom + border-top + border-bottom + margin-top  + margin-bottom元素空间宽度 = width + padding-left + padding-right + border-left + border-right + margin-left + margin-right内盒尺寸计算(元素大小)元素高度 = height + padding-top + padding-bottom + border-top + border-bottom元素宽度 = width + padding-left + padding-right + border-left + border-right
复制代码
IE 模型
  1. 元素空间占据空间大小元素空间高度 = height + padding-top + padding-bottom + border-top + border-bottom(height 包含了 padding, border)元素空间宽度 = width + padding-left + padding-right + border-left + border-right(width包含了 padding, border)内盒尺寸计算(元素大小)元素高度=height(height包含了padding,border)元素宽度=width(width包含了padding,border)
复制代码
我们平常使用的大都是 W3C 标准盒模型

免责声明:如果侵犯了您的权益,请联系站长,我们会及时删除侵权内容,谢谢合作!

本帖子中包含更多资源

您需要 登录 才可以下载或查看,没有帐号?立即注册

x
回复

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

技术支持:迪恩网络科技公司  Powered by Discuz! X3.2
快速回复 返回顶部 返回列表