1、W3C标准盒子模型

  w3c盒子模型的范围包括margin、border、padding、content,并且content部分不包含其他部分

2、IE盒子模型

  IE盒子模型的范围包括margin、border、padding、content,和w3c盒子模型不同的是,IE盒子模型的content部分包含了padding和border

总结:

  IE5.5及更早的版本使用的是IE盒模型。IE6及其以上的版本在标准兼容模式下使用的是W3C的盒模型标准。我们说这是一个好消息因为这意味着此盒模型问题只会出现在IE5.5及其更早的版本中。只要为文档设置一个DOCTYPE,就会使得IE遵循标准兼容模式的方式工作。
        另外,我们现在应该能理解了,css3的box-sizing属性给了开发者选择盒模型解析方式的权利。W3C的盒模型方式被称为“content-box”,IE的被称为“border-box”,使用box-sizing: border-box;就是为了在设置有padding值和border值的时候不把宽度撑开。

IE盒模型和标准盒模型之间的差别的更多相关文章

  1. 怪异盒模型和标准盒模型--CSS

    一,原理 css 属性:Box Moel分为两种:W3C标准和IE标准盒子模型. 大多数浏览器采用W3C标准模型,而IE中采用Microsoft自己的标准. 怪异模式是“部分浏览器在支持W3C标准的同 ...

  2. boxsizing属性 IE盒模型和标准盒模型

    CSS3有一个非常有用但应用不广泛的属性: box-sizing: content-box | border-box | inherit content-box,默认属性,遵从标准盒模型. borde ...

  3. IE盒模型和标准盒模型

    标准盒模型和ie盒模型(怪异盒模型) w3c标准盒模型 width和height不包括padding和border ie盒模型 width和height包含padding和border ie8以上都是 ...

  4. 标准盒模型与IE盒模型之间的转换

    首先上图,这两张很明显可以看出IE盒模型和标准盒模型之间的差别. 当然今天不是去细细追究两种模型具体是怎么去计算布局的,那个很多文章已经已经有过了,不再重复.以前刚开始学习盒模型的时候,就学到的是IE ...

  5. padding标准盒模型和怪异盒子模型

    我们都知道padding是为块级元素设置内边距 但是在使用过程中,我们却会遇到一些问题.padding的标准盒模型和怪异盒模型 padding盒子模型 我们通过demo来讲这个问题,用文字干讲第一没意 ...

  6. w3c标准盒模型与IE传统模型的区别

    一.盒子模型(box model) 在HTML文档中的每个元素被描绘为矩形盒子.确定其大小,属性——比如颜色.背景.边框,及其位置是渲染引擎的目标. CSS下这些矩形盒子由标准盒模型描述.这个模型描述 ...

  7. CSS盒子模型与怪异盒模型

             盒子模型(Box Modle)可以用来对元素进行布局,包括内边距,边框,外边距,和实际内容这几个部分. 盒子模型分为两种 第一种是W3c标准的盒子模型(标准盒模型) .第二种IE标准 ...

  8. 前端css盒模型及标准文档流及浮动问题

    1.盒模型 "box model"这一术语是用来设计和布局时使用,然后在网页中基本上都会显示一些方方正正的盒子.我们称为这种盒子叫盒模型. 盒模型有两种:标准模型和IE模型.这里重 ...

  9. 标准W3C盒子模型和IE盒子模型

    标准W3C盒子模型和IE盒子模型   CSS盒子模型:网页设计中CSS技术所使用的一种思维模型. CSS盒子模型组成:外边距(margin).边框(border).内边距(padding).内容(co ...

  10. CSS3标准盒模型还是IE怪异模型box-sizing属性的应用设置

    在一个文档中,每个元素都被表示为一个矩形的盒子.盒子模型具有4个属性['外边距(margin)','边框(border)','内边距(padding)','内容(content)']. 我们要设置某个 ...

随机推荐

  1. input number类型去掉箭头和禁用滚轮

    input number类型可以输入整型.浮点型.科学计数法的数据 禁用滚轮,在input标签内添加onmouseWheel="return false" <input ty ...

  2. mysql5.7_win64位安装

    1.下载MySQL压缩包解压缩 2.更改my.ini配置文件 [mysqld] #设置3306端口号 port=3306 #设置MySQL的安装目录 basedir=F:\\JavaSoftware\ ...

  3. TCP idle timeout 和TCP Keepalive 比较和分析

    TCP  idle timeout  和TCP Keepalive  是两个独立的功能. TCP  idle timeout  TCP  idle timeout  是系统TCP配置文件中的空闲超时设 ...

  4. redis学习(一)常用命令

    clear 清屏 info 获取当前redis的版本等信息 keys pattern 查找所有符合给定模式( pattern)的 key keys * 查找所有的key type key 查看某个ke ...

  5. HTML-CSS常用代码

    注释标签:对代码进行说明<!-- 单行注释,也可以对多行文字进行注释 -->常用格式标签<b>加粗</b> <i>斜体</i> <u& ...

  6. 22.this指针

    1.this指针工作原理 我们知道,c++的数据和操作也是分开存储,并且每一个非内联成员函数(non-inline member function)只会诞生一份函数实例,也就是说多个同类型的对象会共用 ...

  7. Agora Flat:在线教室的开源初体验

    开发者其实很多时候都非常向往开源,开源领域的大佬也特别多,我们谈不上有多资深,也是一边探索一边做.同时,也希望可以借这次机会把我们摸索到的一些经验分享给大家. 01 Flat 是什么 Flat 是一个 ...

  8. C#实现的网易云音频下载器(白嫖)

    链接 下载点这里 主要是想白嫖音乐,但是java gui写的很复杂,python不会写,c#学的也是半吊子,大大佬们勿喷 经测试大部分音乐可以下载,部分会出现路径非法 form.cs的代码 using ...

  9. java 实现文件夹上传(springBoot 框架)

    有时我们后台管理等服务可能会有这样一个简单需求,就是根据文件夹将整个文件夹下的所有资源都上传到我们的服务器上,本人也是搜索了大量资料,最终以最简单便捷的方式实现该功能,具体操作步骤如下 一.前端如何设 ...

  10. opengl helloworld vscode 通过glfw 绘制三角形

    opengl helloworld vscode 调用glfw 绘制三角形 目录 opengl helloworld vscode 调用glfw 绘制三角形 打开 glfw.org, 我下的64 目录 ...