资讯专栏INFORMATION COLUMN

IE 盒模型和W3C盒模型

孙吉亮 / 807人阅读

摘要:一盒模型就是的宽度,不包括的长度二盒模型三例子比较怪异,在不写的情况下使用盒模型导致相同的代码在和浏览器绘制结果不同。四是的新的属性。盒模型盒模型

一:W3C盒模型

width就是concent的宽度,不包括padding margin border的长度

二:IE盒模型

width=concent+padding+border

三:例子

IE6/7/8比较怪异,在不写doctype的情况下使用ie盒模型
,导致相同的代码在chrome和ie浏览器绘制结果不同。

四:box-sizing

box-sizing是css3的新的属性。

box-sizing:content-box        W3C盒模型
box-sizing:border-box         IE盒模型

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/114162.html

相关文章

  • 深入css布局 (1) — 模型 & 元素分类

    摘要:深入布局盒模型元素分类在知识体系中,除了选择器,样式属性等基础知识外,布局相关的知识才是比较核心和重要的点。从元素的布局特性来分,主要可以分为三类元素块级元素,行内元素,行内块级元素。行内级元素属性取的元素。  深入css布局(1)—— 盒模型 & 元素分类       在css知识体系中,除了css选择器,样式属性等基础知识外,css布局相关的知识才是css比较核心和重要的点。今天我们...

    ky0ncheng 评论0 收藏0
  • 深入css布局(1) — 模型 & 元素分类

    摘要:深入布局盒模型元素分类在知识体系中,除了选择器,样式属性等基础知识外,布局相关的知识才是比较核心和重要的点。规定元素和属性是包含元素的边框内边距内容的。后来微软也慢慢转向了的标准,在以后支持了标准盒模型。行内级元素属性取的元素。 深入css布局(1)—— 盒模型 & 元素分类     在css知识体系中,除了css选择器,样式属性等基础知识外,css布局相关的知识才是css比较核心和重...

    blankyao 评论0 收藏0
  • 【快速入门系列】CSS模型基础

    摘要:引言盒模型是页面布局中经常会使用到的一种思维模型,将等概念运用日常生活中的盒子来形容,因此称之为盒模型。一什么是盒模型我们首先来看一下在中盒模型的样子我们可以清楚的看出,盒模型由内容内边距边框外边距组成。 引言 CSS盒模型是页面布局中经常会使用到的一种思维模型,将margin、border、padding、content等概念运用日常生活中的盒子来形容,因此称之为盒模型。 一、什么是...

    Code4App 评论0 收藏0
  • 【快速入门系列】CSS模型基础

    摘要:引言盒模型是页面布局中经常会使用到的一种思维模型,将等概念运用日常生活中的盒子来形容,因此称之为盒模型。一什么是盒模型我们首先来看一下在中盒模型的样子我们可以清楚的看出,盒模型由内容内边距边框外边距组成。 引言 CSS盒模型是页面布局中经常会使用到的一种思维模型,将margin、border、padding、content等概念运用日常生活中的盒子来形容,因此称之为盒模型。 一、什么是...

    LinkedME2016 评论0 收藏0
  • 【前端学习】-模型

    摘要:前言前端页面的构建过程中,盒模型相关的概念会一直如影随形,因此需要深刻地理解好盒模型。本文将从盒模型描述标准盒模型传统盒模型属性,常见问题。 【前言】前端页面的构建过程中,盒模型相关的概念会一直如影随形,因此需要深刻地理解好盒模型。本文会先简单描述一下盒模型,然后描述一些平常会遇到的注意点。本文将从1、盒模型描述;2、W3C标准盒模型/IE传统盒模型 ;3.box-sizing属性;4...

    jonh_felix 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<