盒子模型:一个物体在页面中所占据的位置

盒子模型包含以下几种元素:

padding;margin;content;border

这是大家都知道的,也是书本上定义说明的,但是在ie的情况下是有点区别的;这是俩种标准

Firefox中采用W3C标准模型,而IE中则采用Microsoft自己的标准

下面我用公式来说明一下:

W3C:

宽=width+(padding-left)+(padding-right)+(margin-left)+(margin-right)+(border-left)+(border-right) 
高=height+(padding-top)+(padding-bottom)+(margin-top)+(margin-bottom)+(border-top)+(border-bottom)

IE盒子模型:

:

宽=width+(border-left)+(border-right) 
高=height+(border-top)+(border-bottom)

盒子模型(W3C盒子模型、IE盒子模型)的更多相关文章

  1. 盒子模型 W3C中和IE中盒子的总宽度分别是什么

    W3C盒模型 总宽度 = margin-left + border-left + padding-left + width + padding-right + border-right + margi ...

  2. IE、W3C两种CSS盒子模型

    利用CSS来布局页面布局DIV有点逻辑性!重点理解盒子模型,标准流和非标准流的区别,还有定位原理!把这3个攻破了,就非常简单了!多实践多参考!最后就是兼容问题了,在实践中自然就有经验了!这些兼容技巧都 ...

  3. W3C标准下的盒模型与IE盒模型

    标准盒模型如下图所示: IE下盒模型如下图所示:

  4. 隐马尔科夫模型HMM(一)HMM模型

    隐马尔科夫模型HMM(一)HMM模型基础 隐马尔科夫模型HMM(二)前向后向算法评估观察序列概率 隐马尔科夫模型HMM(三)鲍姆-韦尔奇算法求解HMM参数(TODO) 隐马尔科夫模型HMM(四)维特比 ...

  5. 生成模型(Generative)和判别模型(Discriminative)

    生成模型(Generative)和判别模型(Discriminative) 引言    最近看文章<A survey of appearance models in visual object ...

  6. 什么是领域模型(domain model)?贫血模型(anaemic domain model) 和充血模型(rich domain model)有什么区别

    http://blog.csdn.net/helloboat/article/details/51208128 领域模型是领域内的概念类或现实世界中对象的可视化表示,又称为概念模型或分析对象模型,它专 ...

  7. 将 ExpressRoute 线路从经典部署模型转移到 Resource Manager 部署模型

    本文概述将 Azure ExpressRoute 线路从经典部署模型转移到 Azure Resource Manager 部署模型的效果. Azure 当前使用两种部署模型:Resource Mana ...

  8. Hadoop MapReduce Task的进程模型与Spark Task的线程模型

    Hadoop的MapReduce的Map Task和Reduce Task都是进程级别的:而Spark Task则是基于线程模型的. 多进程模型和多线程模型 所谓的多进程模型和多线程模型,指的是同一个 ...

  9. thinkphp模型事件(钩子函数:模型中在增删改等操作前后自动执行的事件)

    thinkphp模型事件(钩子函数:模型中在增删改等操作前后自动执行的事件) 一.总结 1.通过模型事件(钩子函数),可以在插入更新删除等前后执行一些特定的功能 2.模型事件是写在模型里面的,控制器中 ...

随机推荐

  1. ArrayList 实现删除重复元素(元素为对象类型)

    package 集合; import java.util.ArrayList;import java.util.Iterator; /* * 删除集合中的重复的元素(元素是对象形式的) *  * Li ...

  2. Hadoop_UDTF示例

    UDTF: 一进多出 UDTF(User-Defined Table-Generating Function)支持一个输入多个输出, 一般用于解析工作,比如说解析url,然后获取url中的信息 编码: ...

  3. 完成对数据库的CRUD操作

    PS:查询相对复杂,要处理结果集,增删改则不用. package it.cast.jdbc; import java.sql.Connection; import java.sql.ResultSet ...

  4. 获取程序的SHA1值

    android获取程序的SHA1值 public static String getSHA1(Context context) { try { PackageInfo info = context.g ...

  5. Java简单类——多对多映射

    class Admin { private String aid ; private String password ; private Role role ; public Admin(String ...

  6. 数据库的修改和删除;比较标签代替<,>,=号;模板替换;session的用法

    注: 1.session:系统默认开启;用途:防止跳过登录(只能访问登录方法);session和cookie的用法(手册->专题); 赋值:session('name','value'); 取值 ...

  7. iOS应用程序的生命周期

    iOS应用程序一般都是由自己编写的代码和系统框架(system frameworks)组成,系统框架提供一些基本infrastructure给所有app来运行,而你提供自己编写的代码来定制app的外观 ...

  8. 启动eclipse时:java is started but returned code 13

    此问题是eclipse位数和java位数不匹配造成的 我的是win10 64位的eclipse + 32位的java造成的问题 查看eclipse位数:用记事本打开eclipse根目录下的eclips ...

  9. 微信小程序-WXSS

    WXSS(WeiXin Style Sheets)是一套样式语言,用于描述 WXML 的组件样式. WXSS 用来决定 WXML 的组件应该怎么显示. 为了适应广大的前端开发者,我们的 WXSS 具有 ...

  10. C#中异常:“The type initializer to throw an exception(类型初始值设定项引发异常)”的简单分析与解决方法

    对于C#中异常:“The type initializer to throw an exception(类型初始值设定项引发异常)”的简单分析,目前本人分析两种情况,如下: 情况一: 借鉴麒麟.NET ...