HTML CSS样式+div属性
盒子模型的基本相关属性
- margin(外边距)
- border(边框)
- padding(内边距)
以上属性分别为top(上)、boottom(下)、left(左)、right(右)。
盒子模型的关系层次
给你们看一个盒子模型的3D立体图,如下图
如图所示:
第一层:border(盒子的边框)
第二层:content和padding(元素的正文即内容,内边距)
第三层:background-image背景图
第四层:background-color背景颜色
第五层:margin(盒子的外边距)
从图片可以看出,当同时设置背景图和背景颜色时,背景图片是在背景颜色上面显示的
盒子居中
css样式中,都知道分为两种,水平居中和垂直居中。
水平居中属性:
- 块级元素的水平居中:margin: 0 auto;
- 文本内容的水平居中:text-align: center;
垂直居中属性: