盒模型

盒模型包括哪些属性

magin
padding
border
width
height

text-align: center的作用是什么,作用在什么元素上?能让什么元素水平居中

作用于内联元素,使内联元素居中

如果遇到一个属性想知道兼容性,在哪查看?

caniuse

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

ie678怪异模式(不添加 doctype)使用 ie 盒模型,宽度=边框+padding+内容宽度
chrome, ie9+, ie678(添加 doctype) 使用标准盒模型, 宽度= 内容宽度


怪异模式.png
谷歌怪异.png
IE6怪异.png
普通模式代码.png
谷歌普通.png

IE6普通.png

知识点-IE 盒模型 vs 标准盒模型

以下代码的作用?兼容性?
*{ box-sizing: border-box;}/*针对所有的元素把盒模型变成border*/

border-box.png

box-sizing属性可以为三个值之一:content-box(default),border-box,padding-box。
content-box,border和padding不计算入width之内
padding-box,padding计算入width内
border-box,border和padding计算入width之内

兼容性

本教程版权归作者和饥人谷所有,转载须说明来源

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

  • 问答题47 /72 常见浏览器兼容性问题与解决方案? 参考答案 (1)浏览器兼容问题一:不同浏览器的标签默认的外补...
    _Yfling阅读 14,693评论 1 92
  • 1.盒模型包括哪些属性 盒模型是css中元素大小的呈现方式,每一个元素都有盒模型。 margin属性,margin...
    墨月千楼阅读 4,622评论 0 0
  • 一、盒模型包括哪些属性 盒模型包括哪些属性 margin:外边距,控制元素周围空间的间隔,它永远是透明的。 bor...
    黄小仙130阅读 3,870评论 0 0
  • 一.盒模型包括哪些属性? 盒模型包括的属性有: margin:外边距。它包括margin-top、margin-r...
    婷楼沐熙阅读 6,720评论 0 2
  • 一、盒模型包括哪些属性? CSS盒模型~即定义了Web页面中的元素是如何看做盒子来解析CSS盒模型属性有: con...
    dengpan阅读 3,199评论 0 0

友情链接更多精彩内容