盒子模型是css的专有名词，用来描述页面设置中的各种属性，如内容（content）、填充（padding）、边框（border）、边界（margin），由于这些属性拼在一起，与日常生活中的“盒子”很相像，因而称作盒子模型

　　盒子模型是分为两类的，一类是W3C盒子模型，另一类是IE盒子模型，最根本区别就是：属性Height与Width这两个值是否包含了padding与border。W3C盒子模型不包含padding与border，仅仅指content的height和width。而IE盒子模型则包含了padding与border。

　　

　　　　　　　　　　　　　　　　W3c模型

　　　　　　　　　               　ie模型

当然，学过jquery的人，应该都知道可以通过jquery.support.boxModel对象返回的属性值，确定页面是否是标准的W3C盒子模型，调用的方法：

　　$.support.boxModel

该方法返回一个布尔值，若是true则表示是W3C盒子模型，否则，就不是。

若是删除<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  就会是ie盒子模型

因而，在编写页面代码时，尽量先声明DOCTYPE类型，使用标准的W3C盒子模型，避免多个浏览器间的相互不兼容。

w3c盒子模型与ie盒子模型的更多相关文章

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

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

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

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

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

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

  4. css盒模型以及如何计算盒子的宽度

    css盒模型以及如何计算盒子的宽度 盒模型 每个存在于可访问性树中的元素都会被浏览器绘制成一个盒子[1]. 每个盒子都可以看成由4部分组成,它们分别是 - 元素外边距(margin).元素边框(bor ...

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

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

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

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

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

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

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

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

  9. 标准盒模型、怪异盒模型（box-sizing）

    CSS中Box model是分为两种: W3C标准(标准盒模型) 和 IE标准盒子模型(怪异盒模型).大多数浏览器采用W3C标准模型,而IE中则采用Microsoft自己的标准. 重要的一个属性是bo ...

随机推荐

  1. uva 11029

    看了别人的解法 发现了 modf 这个函数 取小数部分 /*********************************************************************** ...

  2. css ul li 制作导航条

    <html> <head> <style> .test ul{list-style:none;} .test li{float:left; width:100px; ...

  3. winform窗口打开后文本框的默认焦点设置

    原文:http://blog.csdn.net/kongwei521/article/details/6871411 winform窗口打开后文本框的默认焦点设置,进入窗口后默认聚焦到某个文本框,两种 ...

  4. VS2010彻底卸载

    下载Microsoft Visual Studio 2010 Uninstall Utility来移除,默认情况下,这将删除 Visual Studio 和支持组件,但不会删除与计算机上的其他应用程序 ...

  5. [杂题]HDOJ5515 Game of Flying Circus

    嗯...这是一道水题... 鉴于还没人写这题的题解, 那我就来写一发. 题意:有个边长为300米的正方形 嗯  这样标号 有两个人A和S,开始的时候A.S都在1(左下角)那个位置. 两个人都要按照2. ...

  6. 李洪强iOS开发之【Objective-C】09-空指针和野指针

    一.什么是空指针和野指针 1.空指针 1> 没有存储任何内存地址的指针就称为空指针(NULL指针) 2> 空指针就是被赋值为0的指针,在没有被具体初始化之前,其值为0. 下面两个都是空指针 ...

  7. SpringMVC学习总结(二)——DispatcherServlet详解

    摘要: DispatcherServlet是前端控制器设计模式的实现,提供Spring Web MVC的集中访问点,而且负责职责的分派,而且与Spring IoC容器无缝集成,从而可以获得Spring ...

  8. 什么是spring？

    一.对spring的理解. 1.Spring是实现了工厂模式的工厂类(什么是工厂类?简单的来说就是把需要的接口定义到一个类中,需要的时候不用新建,直接从这个类中调用该接口就可以了), 这个类的名字为B ...

  9. 用DateTime.ToString(string format)输出不同格式的日期

    http://www.cnblogs.com/xvqm00/archive/2009/02/19/1394093.html DateTime.ToString()函数有四个重载.一般用得多的就是不带参 ...

  10. 开源入侵检测系统OSSEC搭建之三：Web界面安装

    注意:以下操作需在OSSEC服务端进行设置 一.下载analogi,存放于/var/www/html/下并赋予权限 [root@localhost ~]# wget https://github.co ...