学习02-css盒子模型

边框border：

属性	用途	注意
border-color	边框颜色	颜色用十六进制#fff
border-width	边框宽度	单位px
border-style	边框样式	solid实线，dashed虚线，dotted点线
综合写法	边框 样式 颜色	border：1px solid red；
border-top-style	单独指定边框	border-top-style：1px solid red；

外边框margin：

marign:0 auto;

内边距padding：

padding: 0 auto;

盒子阴影:

box-shadow:水平阴影 垂直阴影 模糊距离（虚实） 阴影尺寸（影子大小） 阴影颜色 内/外阴影;

值	描述
h-shadow	水平阴影
v-shadow	垂直阴影
blur	模糊距离
spread	阴影的尺寸
color	阴影颜色
inset	内/外阴影
综合写法	box-shadow:0 15px 30px rgba(0,0,0,.3);

圆角边框：

border-radius：length;

盒子坍塌解决方案：

1.可以给父元素定义上边框 transparent透明	border-top：1px solid transparent；
2.可以给父级指定一个上padding值	padding-top：1px;
3.可以给父元素添加overflow：hidden	overflow：hdden；

 

 

 

来源：oschina

链接：https://my.oschina.net/u/4454049/blog/3175570