CSS盒子模型

简介:
(1)css盒子模型
margin 边距    用来设置一个元素所占空间的边缘到相邻元素之间的距离。
border 边框    用来设定一个元素的边线
padding 间隙 (也有人称做补丁)  用来设置元素内容到边框的距离
content (内容,比如文本,图片等)
注意:css的背景属性指的是content和padding,css属性中的width和height指的是content的宽和高。
(2)计算盒子宽和高
盒子的总长度: 左padding +左 border + 左margin+ width +右padding +右 border + 右margin
盒子的总宽度: 上padding +上border + 上margin+ height +下padding + 下border + 下margin
(3)对于margin和padding都有top,left,right,bottom属性,中间用-连接


本文转自 韬光星夜 51CTO博客,原文链接:http://blog.51cto.com/xfqxj/477068,如需转载请自行联系原作者
相关文章
|
3月前
|
前端开发
玩转CSS盒子之 三角形盒子
玩转CSS盒子之 三角形盒子
28 0
|
6月前
|
前端开发
CSS新增样式----圆角边框、盒子阴影、文字阴影
CSS新增样式----圆角边框、盒子阴影、文字阴影
N..
|
24天前
|
前端开发
CSS盒子模型
CSS盒子模型
N..
13 0
|
1月前
|
前端开发 容器
CSS之弹性盒子Flexible Box
CSS之弹性盒子Flexible Box
|
2月前
|
前端开发 JavaScript 容器
CSS学习笔记(一) 盒子模型
CSS学习笔记(一) 盒子模型
|
6月前
|
前端开发
|
6月前
Css-弹性盒子
Css-弹性盒子
52 0
|
3月前
|
Web App开发 前端开发 容器
CSS:盒子模型
CSS:盒子模型
58 1
css3文字阴影和盒子阴影
css3文字阴影和盒子阴影
|
3月前
|
前端开发
CSS【盒子模型】
CSS【盒子模型】
58 0