摘要：
清楚了CSS 盒模型的基本概念、 盒模型类型， 我们就可以深入探讨网页布局的基本模型了。 布局模型与盒模型一样都是 CSS 最基本、 最核心的概念。 但布局模型是建立在盒模型基础之上，又不同于我们常说的 CSS 布局样式或 CSS 布局模板。 如果说布局模型是本，那么 CSS 布局模板就是末了，是外 阅读全文
摘要：
元素与其它元素之间的距离可以使用边界（margin）来设置。边界也是可分为上、右、下、左。如下代码： 也可以分开写： 如果上右下左的边界都为10px;可以这么写： 如果上下边界一样为10px，左右一样为20px，可以这么写： 总结一下：padding和margin的区别，padding在边框里，ma 阅读全文
摘要：
元素内容与边框之间是可以设置距离的，称之为“填充”。填充也可分为上、右、下、左(顺时针)。如下代码： 顺序一定不要搞混。可以分开写上面代码： 如果上、右、下、左的填充都为10px;可以这么写 如果上下填充一样为10px，左右一样为20px，可以这么写： 阅读全文
摘要：
盒模型宽度和高度和我们平常所说的物体的宽度和高度理解是不一样的，css内定义的宽（width）和高（height），指的是填充以里的内容范围。 因此一个元素实际宽度（盒子的宽度）=左边界+左边框+左填充+内容宽度+右填充+右边框+右边界。 元素的高度也是同理。 比如： css代码： html代码： 阅读全文
摘要：
现在有一个问题，如果有想为 p 标签单独设置下边框，而其它三边都不设置边框样式怎么办呢？css 样式中允许只为一个方向的边框设置样式： 同样可以使用下面代码实现其它三边(上、右、左)边框的设置： 阅读全文
摘要：
盒子模型的边框就是围绕着内容及补白的线，这条线你可以设置它的粗细、样式和颜色(边框三个属性)。 如下面代码为 div 来设置边框粗细为 2px、样式为实心的、颜色为红色的边框： 上面是 border 代码的缩写形式，可以分开写： 注意： 1、border-style（边框样式）常见样式有： dash 阅读全文