盒子模型

4 .IE 盒模型和W3C盒模型有什么区别?

w3c标准盒模型主要由:magin + border + padding + content(他不包含其他部分)。

IE盒子模型主要由:magin +  content(他里面包含了border和padding)。


以下代码的作用?兼容性?* { box-sizing: border-box;}

语法:

box-sizing:content-box | border-box

默认值:content-box

适用于:所有接受widthheight的元素

继承性:无

box-sizing属性可以为:content-box,border-box,padding-box。


1.border-box:作用使border和padding计算入width之内,和怪异模式一样了。定义 box-sizing: border-box; 时,浏览器对盒模型的解释与 IE6 相同;

2.content-box:作用使得内容的width就是width,方便计算,就是标准盒模型。定义 box-sizing: content-box; 时,浏览器对盒模型的解释遵从我们之前认识到的 W3C 标准;

3.padding-box:作用使padding计算入width之内。


http://www.w3chtml.com/css3/properties/user-interface/box-sizing.html----学习地址不错的

CSS3 zoom 属性

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 问答题47 /72 常见浏览器兼容性问题与解决方案? 参考答案 (1)浏览器兼容问题一:不同浏览器的标签默认的外补...
    _Yfling阅读 14,685评论 1 92
  • 一、display属性值总结。 1、display:block block元素会独占一行。默认情况下,blo...
    iam梦的的阅读 5,135评论 0 0
  • 前言 总括: 对于盒子模型,BFC,IFC和外边距合并等概念和问题的总结 原文地址:从CSS盒子模型说起 知乎专栏...
    秦至阅读 4,127评论 0 3
  • 很早给孩子入过一套人物漫画书,男性杰出人物的那些书拿去给哥哥看了,女性杰出人物的书一直留在书架上。准备留着等孩子大...
    悦悦和书的那些事阅读 1,358评论 2 0
  • 如果放到现在,武大郎应该是一个名震四方的民营企业家,搞不好在以炊饼为主营业务的支撑下,开始集团化运作,公司实现上市...
    奔跑的七舅姥爷阅读 4,744评论 0 0