侧边栏壁纸
博主头像
落叶人生博主等级

走进秋风,寻找秋天的落叶

  • 累计撰写 130562 篇文章
  • 累计创建 28 个标签
  • 累计收到 9 条评论
标签搜索

目 录CONTENT

文章目录

CSS盒模型和浏览器

2024-05-10 星期五 / 0 评论 / 0 点赞 / 74 阅读 / 1162 字

大家都知道css盒模型,但是它在不同浏览器中会有些差别。下面就来说说这些差别 网页盒子模型存在两种 1.标准w3c盒子模型 2.IE盒子模型 盒子模型的组成 两种盒子模型范围的计算 w3c盒子模型

大家都知道css盒模型,但是它在不同浏览器中会有些差别。下面就来说说这些差别

网页盒子模型存在两种

1.标准w3c盒子模型       2.IE盒子模型

盒子模型的组成

                

两种盒子模型范围的计算

w3c盒子模型宽度=width+padding-left+padding-right+boder-left+border-right+margin-left+margin-right

IE盒子模型宽度=width+margin-left+margin-right

从公式中我们可以看出差别,但这是为什么呢?

原因是在其它浏览器中width指的是content的宽度,而在IE中的width包括了padding和border,因此才有上面显示的差别。那么我们知道前端开发中应尽力解决兼容性问题,因此我们需要在网页中加入文档声明,那么所有浏览器都会按照声明去解释你的盒子模型,网页就能在各个浏览器中显示一致了。

广告 广告

评论区