6.4案例
#box{ width:70px;margin:10px;padding:5px }
? 注意事项：注意元素所占面积的变化。 6.5内边距
和内容元素之间的距离。 1）语法：padding:30px;
2）单边设置：padding-left/top/right/bottom:30px; 3）简写方式：①padding:10px 20px; 上下 左右
②padding:10px 20px 30px 40px; 顺时针，上右下左
6.6外边距
与下一个元素之间的空间量。 1）语法：margin:30px; 2）单边设置：margin-left/top/right/bottom:30px; 3）简写方式：①margin:10px 20px; 上下 左右 ②margin:10px 20px 30px 40px; 顺时针，上右下左
4）特殊写法：margin:0px auto; 对matgin而言，margin可取值为auto，使某个框居中显示；屏幕宽度减去元素宽度，除以2，左右平分
7
七、背景样式
7.1背景色
background-color:颜色;
7.2背景图像
background-image:url(a.jpg);/*注意，url里没有双引号*/
7.3背景平铺
background-repeat:repeat（默认的）/no-repeat/repeat-x/repeat-y; 7.4背景固定 background-attachment:scroll/fixed;/*scroll:背景和内容一起滚动;fixed:背景固定，类似于水印的效果，走到哪跟到哪*/ 7.5背景定位 background-position:left top;/*可写px、%、center单词*/ 7.6组合设置 background:background-color || background-image || background-repeat || background-attachment || background-position; 7.7案例 background:#9dcdfe url(a.jpg) no-repeat fixed left top; ? 注意事项： ? 如使用组合属性定义其单个参数，则其他参数的默认值将无条件覆盖各自对应的单个属性设置。比如设置background:white等价于设置 background:white none repeat scroll 0% 0% 如果在此之前设置background-image属性，则其设置将被background-image 的默认值none覆盖。 ?
八、文本/字体样式
8.1指定字体
1）语法：
font-family:name;
font-family:ncursive/fantasy/monospace/serif/sans-serif; 2）取值说明：
name：字体名称。按优先顺序排列。以逗号隔开。如果字体名称包含空格，则应使
用引号括起第二种声明方式使用所列出的字体序列名称。如果使用fantasy序列，将提供默认字体序列。
8.2字体颜色
1）语法：color:color;
? 注意事项：用颜色名称指定 color 不被一些浏览器接受。但使用 RGB 值指定颜色
能被所有里浏览器识别并正确显示。 8.3字体大小
1）语法：font-size:xx-small/x-small/small/medium/large/x-large/xx-large/larger/smaller/length; 2）取值说明：
①xx-small：绝对字体尺寸。根据对象字体进行调整。最小 ②x-small：绝对字体尺寸。根据对象字体进行调整。较小 ③small：绝对字体尺寸。根据对象字体进行调整。小
④medium：默认值。绝对字体尺寸。根据对象字体进行调整。正常 ⑤large：绝对字体尺寸。根据对象字体进行调整。大 ⑥x-large：绝对字体尺寸。根据对象字体进行调整。较大 ⑦xx-large：绝对字体尺寸。根据对象字体进行调整。最大 ⑧larger：相对字体尺寸。相对于父对像中字体尺寸进行相对增大。使用成比例的 em
单位计算
⑨smaller：相对字体尺寸。相对于父对像中字体尺寸进行相对减小。使用成比例的
em 单位计算
⑩length：百分数/由浮点数字和单位标识符组成的长度值，不可为负值。 其百分比
取值是基于父对象中字体的尺寸。 ? 注意事项：字体一般为10-12磅。
8.4字体加粗
1）语法：font-weight:normal/bold/bolder/lighter/100/200/300/400/500/600/700/800/900; 2）取值说明：
①normal：默认值，正常的字体，相当于 400 。声明此值将取消之前任何设置 ②bold ：粗体。相当于 700 。也相当于 b 对象的作用 ③bolder：比 normal 粗 ④lighter：比 normal 细
⑤100：字体至少像 200 那样细
⑥200：字体至少像 100 那样粗，像 300 那样细
9
⑦300：字体至少像 200 那样粗，像 400 那样细 ⑧400：相当于 normal
⑨500：字体至少像 400 那样粗，像 600 那样细 ⑩600：字体至少像 500 那样粗，像 700 那样细 ?700：相当于 bold
?800：字体至少像 700 那样粗，像 900 那样细 ?900：字体至少像 800 那样粗
8.5文本排列
1）语法：text-align:left/right/center/justify; 2）取值说明：
①left：默认值。左对齐 ②right：右对齐 ③center：居中对齐 ④justify：两端对齐 ? 注意事项：
? 此属性作用于所有块级元素，在一个div对象里的所有块级元素会继承此属性值。
? 只对块级元素生效，对行内元素无效！
8.6行高
常用于控制文本的垂直布局。 1）语法：line-height:normal/length; 2）取值说明：
①normal：默认值。默认行高 ②length：百分比数字/由浮点数字和单位标识符组成的长度值，允许为负值。 其百
分比取值是基于字体的高度尺寸。 ? 注意事项：设置为和包含元素一样高，即可实现垂直居中效果。
8.7文字修饰
1）语法：text-decoration:none || underline || blink || overline || line-through; 2）取值说明：
①none：默认值。无装饰 ②blink：闪烁 ③underline：下划线 ④line-through：贯穿线 ⑤overline：上划线 ? 注意事项：
? 假如none值在属性声明的最后，所有的先前的其他取值都会被清除。
例如，声明text-decoration: underline overline blink none 等于声明text-decoration: none。
? 指定块对象的此属性将影响其所有内联子对象。
8.8文本缩进
首行缩进，常用于段落。 1）语法：text-indent:length;
2）取值说明：length：百分比数字/由浮点数字和单位标识符组成的长度值，允许为负值，默认值为 0 。
10
九、表格样式
是表格特有的的属性。
9.1垂直对齐
vertical-align:top/middle（默认）/bottom;单元格中垂直方向上的对齐
9.2边框合并
border-collapse:separate（默认）/collapse; 对table设置此属性，对td设置无效
9.3边框边距
border-spacing:value; ? 注意事项：
? 对table设置边框，仅仅是显示表格的外边框（不是单元格的）。 ? margin:0px auto;/*块级元素可用matgin居中*/ ? text-align:right;对行内不管用
11