CSSday06笔记

一、外边距

1. 外边距属性

margin属性用于设置内边距，也是复合属性，相关设置如下

margin-top:上内边距；padding-right:右内边距

margin-bottom:下内边距；padding-left:左内边距

margin:上内边距[右内边距下内边距左内边距]

2. 对块元素应用宽度属性width，并将左右的外边距都设置为auto，可使块级元素水平居中，实际工作中常用这种方式进行网页布局，示例代码如下：

.header{ width:960px; margin:0 auto;}

为了更方便地控制网页中的元素，制作网页时，可使用如下代码清除元素的默认内外边距：

*{

       padding:0;/*清除内边距*/

        margin:0;/*清除外边距*/

}

3.注意：

行内元素不要给上下的margin和padding上下margin和padding会被忽略。

左右margin和padding会起作用。

使用margin定义块元素的垂直外边距时，可能会出现外边距的合并。

二、盒子的宽和高

使用宽度属性width和高度属性height可以对盒子的大小进行控制。

width和height的属性值可以为不同单位的数值或相对于父元素的百分比%，实际工作中最常用的是像素值。

大多数浏览器，如Firefox、IE6及以上版本都采用了W3C规范，符合CSS规范的盒子模型的总宽度和总高度的计算原则是：

盒子的总宽度=width+左右内边距之和+左右边框宽度之和+左右外边距之和

盒子的总高度= height+上下内边距之和+上下边框宽度之和+上下外边距之和

注意：