盒模型
-
盒模型包括哪些属性
从内到外分别是content，padding，border，margin
盒模型 -
text-align: center的作用是什么，作用在什么元素上？能让什么元素水平居中
The **text-align
** CSS property describes how inline content like text is aligned in its parent block element. text-align
does not control the alignment of block elements, only their inline content.
text-align: center;的作用是使行内元素相对与他的父元素块级元素居中，作用在块级元素上，能让行内元素水平居中
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
div {
border: 1px solid;
}
.box {
display: inline-block;
width: 200px;
height: 200px;
background-color: #ccc;
vertical-align: bottom;
}
.wrapper {
text-align: center;
}
</style>
</head>
<body>
<div class="wrapper">
<div class="box"></div>
</div>
</body>
</html>
text-align: center;
- 如果遇到一个属性想知道兼容性，在哪查看?
caniuse或者MDN -
IE 盒模型和W3C盒模型有什么区别?
默认情况下IE盒模型中width包括了content、padding、border，而W3C的盒模型只包括content
W3C盒模型和IE盒模型 - 以下代码的作用？兼容性？
作用是使所有的元素width包含到padding和border
*{
box-sizing: border-box;
}
首先是通配符选择器的兼容性，在IE6中不支持
通配符选择器兼容性
然后是
box-sizing的兼容性，在IE6和IE7中不支持
box-sizing兼容性
