css3盒子模型:

css3盒子模型:
1.盒子尺寸①.box-sizing 定义盒子模型的尺寸解析方式。box-sizing: content-box; 默认值 width和height属性设置的大小是内容的大小。box-sizing: border-box; width和height属性设置的大小是盒子的大小(contentpaddingborder)②.resize是否允许用户缩放调节元素尺寸大小。overflow: hidden; resize要生效必须设置overflow:hiddenresize: none; 不可调整大小resize: horizontal; 水平方向调整大小resize: vertical; 垂直方向调整大小resize: both; 两个方向调整大小2.displaydisplay 盒子是否显示以及如何显示。值block none inline-block inline list-item table等等3.盒子阴影外阴影:box-shadow: 10px 10px 12px 2px #ccc;水平偏移 垂直偏移 模糊值 外延值 颜色内阴影:box-shadow: inset 10px 10px 12px 2px #ccc;内阴影 水平偏移 垂直偏移 模糊值 外延值 颜色复合阴影中间用 , 隔开。先写的阴影在上面。4.盒子倒影-webkit-box-reflect 只有webkit内核可用。倒影不占位置。-webkit-box-reflect: below 10px url(1.png);第一个值方向 above below left right第二个值间距倒影和元素的间距第三个值图片可以指定url可以用渐变5.盒子不透明度opacity 检索或设置对象的不透明度。 值是0~1的范围。对于尚不支持opacity属性的IE浏览器可以使用IE私有的滤镜属性来实现与opacity相同的效果。filter: alpha(opacity透明值)