目录前言CSS颜色与背景颜色color属性背景background属性1.背景颜色background，color2.背景图像background，image3.背景图像平铺方式background，repeat4.固定，滚动背景图像background，attachment5.定位背景图像background，position6.背...。![css3html5第七章制作表单 (CSS3 HTML5 JavaScript [HTML]Web前端开发技术9)](http://images.shejidaren.com/wp-content/uploads/auto_save_image/2012/04/021857rXX.jpg)
![css3html5第七章制作表单 (CSS3 HTML5 JavaScript [HTML]Web前端开发技术9)](http://images.shejidaren.com/wp-content/uploads/auto_save_image/2012/05/024514LEr.jpg)
目录
前言
CSS颜色与背景
颜色color属性
背景background属性
1. 背景颜色background-color
2. 背景图像background-image
3. 背景图像平铺方式background-repeat
4. 固定/滚动背景图像background-attachment
5. 定位背景图像background-position
6. 背景简写background
CSS列表样式
1. 样式类型list-style-type
CSS盒模型
CSS盒模型结构
边界属性设置
填充属性设置
课后练习
总结
前言
CSS 颜色与背景
颜色 color 属性
背景 background 属性
CSS 列表样式
CSS 盒模型
课后练习
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>块级元素与行级元素高宽度的区别</title>
<style>
.special{border:1px solid #036;width:200px;height:50px;background:#ccc;margin:5px;/*display:block;*/}
</style>
</head><body>
<div class="special">这是div元素</div>
<span class="special">这是span元素</span>
</body>
</html>
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>文档流定位</title>
<style>*{margin:0;padding:0;}#nav{margin:0 auto;width:300px;text-align:center;}a{width:80px;height:30px;border-bottom:1px solid #666;font-size:14px;text-align:center;line-height:30px;height:30px;width:80px;text-decoration:none;display:inline-block;}a:hover{color:#fff;background-color:#999;border:1px solid;border-top-color:#FF8000;border-right-color:#FF8000;border-left-color:#FF8000;}
</style>
</head><body><div id="nav"><a href="#">链接1</a><a href="#">链接2</a><a href="#">链接3</a></div>
</body>
</html>总结