CSS Web开发学习实录PDF电子书下载

第1章 CSS快速入门 1

1.1第一个CSS实例 2

视频教学：9分钟 2

1.1.1基础知识——CSS基础 2

1.1.2实例描述 5

1.1.3实例应用 5

1.1.4运行结果 7

1.2使用CSS样式 9

视频教学：9分钟 9

1.2.1基础知识——CSS样式的使用方式 9

1.2.2实例描述 11

1.2.3实例应用 11

1.2.4运行结果 12

1.2.5实例分析 13

1.3 CSS的语法 13

1.4增强CSS的可读性——使用注释 13

1.5 CSS优先级 14

视频教学：8分钟 14

1.5.1 CSS的后来居上原则 14

1.5.2 CSS的继承性 15

1.5.3 CSS的选择器优先级 16

1.5.4 ！important声明强制优先 18

1.6 CSS中风格不一的文字 18

视频教学：8分钟 18

1.6.1基础知识——CSS中的单位 18

1.6.2实例描述 20

1.6.3实例应用 20

1.6.4运行结果 22

1.6.5实例分析 22

1.7选择一款网页制作工具 23

1.8常见问题解答 25

1.8.1学习CSS需要哪些特殊的软件 25

1.8.2 CSS+div菜鸟级问题 25

1.8.3学习CSS都需要哪些基础知识 25

1.9习题 26

第2章 选择符 29

2.1设置指定文字的样式 30

视频教学：4分钟 30

2.1.1基础知识——通用选择符 30

2.1.2实例描述 30

2.1.3实例应用 30

2.1.4运行结果 31

2.1.5实例分析 31

2.2设置表格的样式 32

视频教学：5分钟 32

2.2.1基础知识——标签选择符 32

2.2.2实例描述 32

2.2.3实例应用 32

2.2.4运行结果 33

2.2.5实例分析 34

2.3实现图片的层叠效果 34

视频教学：5分钟 34

2.3.1基础知识——id选择符 34

2.3.2实例描述 34

2.3.3实例应用 35

2.3.4运行结果 35

2.3.5实例分析 36

2.4克隆div元素 36

视频教学：5分钟 36

2.4.1基础知识——class选择符 36

2.4.2实例描述 36

2.4.3实例应用 37

2.4.4运行结果 37

2.4.5实例分析 38

2.5实现动态变色的效果 38

视频教学：5分钟 38

2.5.1基础知识——伪类及伪元素选择符 38

2.5.2实例描述 38

2.5.3实例应用 39

2.5.4运行结果 39

2.5.5实例分析 40

2.6设置统一样式 41

视频教学：5分钟 41

2.6.1基础知识——群组选择符 41

2.6.2实例描述 41

2.6.3实例应用 41

2.6.4运行结果 42

2.6.5实例分析 42

2.7设置div中包含的标签样式 43

视频教学：4分钟 43

2.7.1基础知识——包含选择符 43

2.7.2实例描述 44

2.7.3实例应用 44

2.7.4运行结果 44

2.7.5实例分析 45

2.8常见问题解答 45

2.8.1 CSS中的包含选择符与子对象选择符的区别 45

2.8.2 CSS选择符问题 46

2.8.3怎样用CSS选取表格的第一列CSS选择符 46

2.9习题 47

第3章 伪类和伪元素 49

3.1制作多彩的超链接 50

视频教学：6分钟 50

3.1.1基础知识——链接伪类 50

3.1.2实例描述 50

3.1.3实例应用 51

3.1.4运行结果 52

3.1.5实例分析 53

3.2高亮显示输入元素的登录表单 54

视频教学：5分钟 54

3.2.1基础知识——：focus伪类 54

3.2.2实例描述 54

3.2.3实例应用 54

3.2.4运行结果 55

3.2.5实例分析 56

3.3为首个子对象定义样式 56

视频教学：5分钟 56

3.3.1基础知识——：first-child伪类 56

3.3.2实例描述 57

3.3.3实例应用 57

3.3.4运行结果 58

3.3.5实例分析 59

3.4设置HTML页面的打印尺寸 59

视频教学：5分钟 59

3.4.1基础知识——：first伪类、：right伪类和：left伪类 59

3.4.2实例描述 60

3.4.3实例应用 60

3.4.4运行结果 61

3.4.5实例分析 61

3.5修饰文字的特殊样式 62

视频教学：5分钟 62

3.5.1基础知识——：lang伪类 62

3.5.2实例描述 63

3.5.3实例应用 63

3.5.4运行结果 64

3.5.5实例分析 64

3.6个性化的歌词显示页 64

视频教学：5分钟 65

3.6.1基础知识——：first-letter伪元素和：first-line伪元素 65

3.6.2实例描述 65

3.6.3实例应用 65

3.6.4运行结果 66

3.6.5实例分析 67

3.7替换指定位置 67

视频教学：7分钟 67

3.7.1基础知识——：before伪元素和：after伪元素 67

3.7.2实例描述 69

3.7.3实例应用 69

3.7.4运行结果 70

3.7.5实例分析 71

3.8常见问题解答 71

3.8.1 CSS中伪类的应用问题 71

3.8.2关于CSS伪类鼠标效果 72

3.8.3关于first-child伪类无效的问题 72

3.8.4 box：after｛｝的功能 73

3.9习题 73

第4章 字体属性 77

4.1炫彩诗 78

视频教学：5分钟 78

4.1.1基础知识——Color 78

4.1.2实例描述 78

4.1.3实例应用 79

4.1.4运行结果 80

4.1.5实例分析 80

4.2编排网页 80

视频教学：8分钟 80

4.2.1基础知识——字体 80

4.2.2实例描述 87

4.2.3实例应用 88

4.2.4运行结果 89

4.2.5实例分析 89

4.3网页文章——感怀秋天 89

视频教学：6分钟 89

4.3.1基础知识——字体装饰 89

4.3.2实例描述 94

4.3.3实例应用 94

4.3.4运行结果 95

4.3.5实例分析 96

4.4设置字体间隔 96

视频教学：3分钟 96

4.4.1基础知识——字体间隔 96

4.4.2实例描述 98

4.4.3实例应用 98

4.4.4运行结果 98

4.4.5实例分析 99

4.5行高 99

视频教学：5分钟 99

4.5.1基础知识——字体行高 99

4.5.2实例描述 101

4.5.3实例应用 101

4.5.4运行结果 102

4.5.5实例分析 103

4.6常见问题解答 103

4.6.1字体名称样式的问题 103

4.6.2 italic和oblique的问题 103

4.6.3字体大小问题 103

4.7习题 104

第5章 文本属性 107

5.1推荐图书详细信息 108

视频教学：6分钟 108

5.1.1基础知识——text-indent属性 108

5.1.2基础知识——vertical-align属性 109

5.1.3基础知识——text-align属性 110

5.1.4基础知识——white-space属性 111

5.1.5基础知识——ruby-align属性 112

5.1.6实例描述 113

5.1.7实例应用 113

5.1.8运行结果 115

5.1.9实例分析 115

5.2网站简介内容 116

视频教学：5分钟 116

5.2.1基础知识——direction属性 116

5.2.2基础知识——layout-layout-flow属性 117

5.2.3基础知识——writing-mode属性 117

5.2.4实例描述 118

5.2.5实例应用 118

5.2.6运行结果 118

5.2.7实例分析 119

5.3详细新闻信息内容 119

视频教学：6分钟 119

5.3.1基础知识——text-autospace属性 119

5.3.2基础知识——text-kashida-space属性 120

5.3.3基础知识——word-break属性 121

5.3.4基础知识——line-break属性 121

5.3.5基础知识——word-wrap属性 121

5.3.6实例描述 122

5.3.7实例应用 122

5.3.8运行结果 123

5.3.9实例分析 124

5.4新闻信息列表设置 124

视频教学：5分钟 124

5.4.1基础知识——text-transform属性 124

5.4.2基础知识——text-decoration属性 125

5.4.3基础知识——text-overflow属性 125

5.4.4实例描述 126

5.4.5实例应用 126

5.4.6运行结果 127

5.4.7实例分析 128

5.5常见问题解答 128

5.5.1 CSS闪烁效果问题 128

5.5.2 ruby-align属性无效 128

5.5.3显示省略号问题 129

5.6习题 130

第6章 边框与尺寸属性 131

6.1设置一个彩色的盒子 132

视频教学：5分钟 132

6.1.1基础知识——border-style属性 132

6.1.2基础知识——border-width属性 133

6.1.3基础知识——border-color属性 135

6.1.4基础知识——border属性 136

6.1.5实例描述 136

6.1.6实例应用 136

6.1.7运行结果 137

6.1.8实例分析 137

6.2设置一个圆角边框 138

视频教学：12分钟 138

6.2.1基础知识——border-top属性 138

6.2.2基础知识——border-right属性 140

6.2.3基础知识——border-bottom属性 141

6.2.4基础知识——border-le属性 142

6.2.5实例描述 143

6.2.6实例应用 143

6.2.7运行结果 144

6.2.8实例分析 144

6.3使用百分比设置图像的尺寸 145

视频教学：7分钟 145

6.3.1基础知识——height属性 145

6.3.2基础知识——max-height属性 145

6.3.3基础知识——min-height属性 146

6.3.4基础知识——width属性 146

6.3.5基础知识——max-width属性 147

6.3.6基础知识——min-width属性 148

6.3.7实例描述 149

6.3.8实例应用 149

6.3.9运行结果 150

6.3.10实例分析 150

6.4常见问题解答 150

6.4.1 CSS边框错误 150

6.4.2 CSS的边框显示有问题 151

6.5习题 151

第7章 边距与间隙属性 153

7.1边距与间隙的概念 154

7.2水果价格表格 155

视频教学：10分钟 155

7.2.1基础知识——margin-top属性 155

7.2.2基础知识——margin-right属性 156

7.2.3基础知识——margin-bottom属性 157

7.2.4基础知识——margin-le属性 157

7.2.5实例描述 158

7.2.6实例应用 158

7.2.7运行结果 159

7.2.8实例分析 160

7.3设置段落的整体边距 160

视频教学：4分钟 160

7.3.1基础知识——margin属性 160

7.3.2实例描述 161

7.3.3实例应用 161

7.3.4运行结果 162

7.3.5实例分析 162

7.4设置图片间隙 162

视频教学：6分钟 162

7.4.1基础知识——padding-top属性 162

7.4.2基础知识——padding-right属性 163

7.4.3基础知识——padding-bottom属性 164

7.4.4基础知识——padding-le属性 165

7.4.5实例描述 165

7.4.6实例应用 166

7.4.7运行结果 166

7.4.8实例分析 167

7.5设置交易笔数表格的间隙 167

视频教学：4分钟 167

7.5.1基础知识——padding属性 167

7.5.2实例描述 168

7.5.3实例应用 168

7.5.4运行结果 170

7.5.5实例分析 171

7.6常见问题解答 171

7.6.1消除两个div之间的间隙问题 171

7.6.2 margin边距问题 172

7.6.3 margin-top属性遇到点小问题 173

7.7习题 173

第8章 颜色与背景属性 175

8.1后台管理系统 176

视频教学：4分钟 176

8.1.1基础知识——background-color属性 176

8.1.2实例描述 176

8.1.3实例应用 176

8.1.4运行结果 178

8.1.5实例分析 178

8.2个人博客 178

视频教学：10分钟 179

8.2.1基础知识——background属性 179

8.2.2基础知识——background-image属性 179

8.2.3基础知识——background-attachment属性 180

8.2.4基础知识——background-repeat属性 181

8.2.5实例描述 182

8.2.6实例应用 182

8.2.7运行结果 183

8.2.8实例分析 183

8.3设置网站Logo位置 184

视频教学：8分钟 184

8.3.1基础知识——background-position属性 184

8.3.2基础知识——background-position-x属性 185

8.3.3基础知识——background-position-y属性 185

8.3.4基础知识——layer-background-color属性 186

8.3.5基础知识——layer-background-image属性 186

8.3.6实例描述 187

8.3.7实例应用 187

8.3.8运行结果 187

8.3.9实例分析 188

8.4常见问题解答 188

8.4.1背景图片重复显示 188

8.4.2背景滚动问题 189

8.5习题 189

第9章 列表属性 191

9.1构建试卷页面 192

视频教学：5分钟 192

9.1.1基础知识——list-style-type属性 192

9.1.2实例描述 194

9.1.3实例应用 194

9.1.4运行结果 196

9.1.5实例分析 196

9.2新闻中心图像列表 196

视频教学：4分钟 197

9.2.1基础知识——list-style-image属性 197

9.2.2实例描述 198

9.2.3实例应用 198

9.2.4运行结果 199

9.2.5实例分析 199

9.3“阶梯形”新闻展示页面 200

视频教学：11分钟 200

9.3.1基础知识——list-style-position属性 200

9.3.2实例描述 201

9.3.3实例应用 201

9.3.4运行结果 202

9.3.5实例分析 203

9.4制作文章详解页面 203

视频教学：5分钟 203

9.4.1基础知识识——list-style属性 203

9.4.2实例描述 205

9.4.3实例应用 205

9.4.4运行结果 206

9.4.5实例分析 206

9.5常见问题解答 206

9.5.1 list-style和list-style-type在IE中不显示的问题 206

9.5.2 list-style-type在IE与Firefox中奇怪的现象 207

9.5.3关于ul ul ul的CSS规则定义问题 208

9.6习题 209

第10章 滚动条属性 213

10.1制作带有彩色3D亮边框的滚动条 214

视频教学：5分钟 214

10.1.1基础知识——scrollbar-3dlight-color 214

10.1.2实例描述 214

10.1.3实例应用 214

10.1.4运行结果 215

10.1.5实例分析 215

10.2制作带有彩色亮边框的滚动条 216

视频教学：4分钟 216

10.2.1基础知识——scrollbar-highlight-color 216

10.2.2实例描述 216

10.2.3实例应用 216

10.2.4运行结果 217

10.2.5实例分析 218

10.3制作彩色滚动条区块 218

视频教学：4分钟 218

10.3.1基础知识——scrollbar-face-color 218

10.3.2实例描述 219

10.3.3实例应用 219

10.3.4运行结果 219

10.3.5实例分析 220

10.4制作突出方向箭头 220

视频教学：3分钟 220

10.4.1基础知识——scrollbar-arrow-color 220

10.4.2实例描述 221

10.4.3实例应用 221

10.4.4运行结果 222

10.4.5实例分析 222

10.5制作突出滚动条阴影效果 222

视频教学：4分钟 222

10.5.1基础知识——scrollbar-shadow-color 223

10.5.2实例描述 223

10.5.3实例应用 223

10.5.4运行结果 224

10.5.5实例分析 225

10.6制作彩色滚动条暗边框 225

视频教学：4分钟 225

10.6.1基础知识——scrollbar-darkshadow-color 225

10.6.2实例描述 225

10.6.3实例应用 226

10.6.4运行结果 226

10.6.5实例分析 227

10.7制作滚动条基准色 227

视频教学：5分钟 227

10.7.1基础知识——scrollbar-base-color 227

10.7.2实例描述 227

10.7.3实例应用 228

10.7.4运行结果 228

10.7.5实例分析 229

10.8制作彩色滚动条拖动区域 229

视频教学：4分钟 229

10.8.1基础知识——scrollbar-track-color 229

10.8.2实例描述 229

10.8.3实例应用 230

10.8.4运行结果 230

10.8.5实例分析 231

10.9常见问题解答 231

10.9.1滚动条颜色控制失效 231

10.9.2滚动条滑块的问题 231

10.10习题 232

第11章 统揽全局——页面的定位与布局 235

11.1盒子模型 236

11.2具有固定位置的广告框 237

视频教学：6分钟 237

11.2.1基础知识——定位方式和位置 237

11.2.2实例描述 238

11.2.3实例应用 238

11.2.4运行结果 239

11.2.5实例分析 240

11.3文字阴影效果 240

视频教学：11分钟 240

11.3.1基础知识——z-index属性 240

11.3.2实例描述 242

11.3.3实例应用 242

11.3.4运行结果 243

11.3.5实例分析 243

11.4文字环绕的图片 243

视频教学：11分钟 244

11.4.1基础知识——浮动定位 244

11.4.2实例描述 246

11.4.3实例应用 247

11.4.4运行结果 248

11.4.5实例分析 248

11.5显示一个图片的局部 248

视频教学：11分钟 248

11.5.1基础知识——clip 248

11.5.2实例描述 249

11.5.3实例应用 249

11.5.4运行结果 250

11.5.5实例分析 250

11.6带滚动条的页面模块 251

视频教学：11分钟 251

11.6.1基础知识——overflow 251

11.6.2实例描述 251

11.6.3实例应用 251

11.6.4运行结果 252

11.6.5实例分析 253

11.7横排的列表元素 253

视频教学：4分钟 253

11.7.1基础知识——display 253

11.7.2实例描述 254

11.7.3实例应用 254

11.7.4运行结果 255

11.7.5实例分析 256

11.8使页面元素不可见 256

11.9常见问题解答 258

11.9.1 div布局用绝对定位好还是用相对定位好 258

11.9.2 CSS样式中float属性的问题 258

11.10习题 259

第12章 逐步改善页面的表格 261

12.1表格特有的元素 262

12.2制作一个单线边框表格 262

视频教学：7分钟 263

12.2.1基础知识——border-collapse 263

12.2.2实例描述 264

12.2.3实例应用 264

12.2.4运行结果 265

12.2.5实例分析 265

12.3设置单元格边界之间的距离 266

视频教学：4分钟 266

12.3.1基础知识——border-spacing 266

12.3.2实例描述 266

12.3.3实例应用 266

12.3.4运行结果 268

12.3.5实例分析 268

12.4设置表格标题的位置 268

视频教学：3分钟 269

12.4.1基础知识——caption-side 269

12.4.2实例描述 269

12.4.3实例应用 269

12.4.4运行结果 270

12.4.5实例分析 271

12.5隐藏表格中空单元格上的边框和背景 271

视频教学：4分钟 271

12.5.1基础知识——empty-cells 271

12.5.2实例描述 272

12.5.3实例应用 272

12.5.4运行结果 273

12.5.5实例分析 273

12.6隐藏单元格超出的数据 273

视频教学：5分钟 274

12.6.1基础知识——table-layout 274

12.6.2实例描述 275

12.6.3实例应用 275

12.6.4运行结果 277

12.6.5实例分析 278

12.7常见问题解答 278

12.7.1 border-collapse问题 278

12.7.2 CSS表格样式问题 278

12.7.3 border-collapse取值的区别 279

12.8习题 279

第13章 逐步改善页面的表单 281

13.1制作特殊样式的文本框 282

视频教学：4分钟 282

13.1.1基础知识——CSS为表单元素设置样式 282

13.1.2实例描述 282

13.1.3实例应用 283

13.1.4运行结果 284

13.1.5实例分析 284

13.2制作特殊样式的文本框和按钮 284

视频教学：4分钟 285

13.2.1基础知识——同一个表单中的元素应用不同的样式 285

13.2.2实例描述 286

13.2.3实例应用 286

13.2.4运行结果 287

13.2.5实例分析 287

13.3创建与文档同行的搜索框 287

视频教学：2分钟 287

13.3.1基础知识——避免表单创建额外的空格和换行符 288

13.3.2实例描述 288

13.3.3实例应用 288

13.3.4运行结果 289

13.3.5实例分析 290

13.4对相关的字段进行分组 290

视频教学：3分钟 290

13.4.1基础知识——fieldset元素 290

13.4.2实例描述 290

13.4.3实例应用 290

13.4.4运行结果 291

13.4.5实例分析 292

13.5为快捷键提示信息设置样式 292

视频教学：5分钟 292

13.5.1基础知识——accesskey属性 292

13.5.2实例描述 293

13.5.3实例应用 293

13.5.4运行结果 294

13.5.5实例分析 295

13.6制作不同背景的下拉菜单 295

视频教学：4分钟 295

13.6.1基础知识——使用不同背景强调select下拉菜单 295

13.6.2实例描述 296

13.6.3实例应用 296

13.6.4运行结果 297

13.6.5实例分析 297

13.7强调显示当前焦点字段 297

视频教学：4分钟 298

13.7.1基础知识——强调用户单击的表单字段 298

13.7.2实例描述 298

13.7.3实例应用 298

13.7.4运行结果 299

13.7.5实例分析 300

13.8常见问题解答 300

13.8.1 HTML中的fieldset的问题 300

13.8.2如何使用accesskey的问题 301

13.9习题 302

第14章 滤镜及其他 305

14.1滤镜特效 306

14.2制作文字、图像透明特效 307

视频教学：5分钟 307

14.2.1基础知识——Alpha滤镜 307

14.2.2实例描述 308

14.2.3实例应用 308

14.2.4运行结果 309

14.2.5实例分析 309

14.3制作两张图像轮换交替显示效果 309

视频教学：4分钟 310

14.3.1基础知识——BlendTrans滤镜 310

14.3.2实例描述 310

14.3.3实例应用 311

14.3.4运行结果 312

14.3.5实例分析 313

14.4制作麦子随风起舞特效 313

视频教学：4分钟 313

14.4.1基础知识——Blur滤镜 313

14.4.2实例描述 314

14.4.3实例应用 314

14.4.4运行结果 315

14.4.5实例分析 316

14.5制作半透明字体 316

视频教学：4分钟 316

14.5.1基础知识——Chroma滤镜 316

14.5.2实例描述 317

14.5.3实例应用 317

14.5.4运行结果 317

14.5.5实例分析 318

14.6制作投影“宠物秀”页面 318

视频教学：6分钟 318

14.6.1基础知识——Shadow滤镜与DropShadow滤镜 318

14.6.2实例描述 319

14.6.3实例应用 320

14.6.4运行结果 320

14.6.5实例分析 321

14.7可翻转的图像和文字 321

视频教学：5分钟 321

14.7.1基础知识——FlipH滤镜与FlipV滤镜 321

14.7.2实例描述 323

14.7.3实例应用 323

14.7.4运行结果 324

14.7.5实例分析 324

14.8制作光晕字 325

视频教学：5分钟 325

14.8.1基础知识——Glow滤镜 325

14.8.2实例描述 326

14.8.3实例应用 326

14.8.4运行结果 327

14.8.5实例分析 328

14.9让古代美女的粉色衣裳变为灰色 328

视频教学：8分钟 328

14.9.1基础知识——Gray滤镜 328

14.9.2实例描述 329

14.9.3实例应用 329

14.9.4运行结果 330

14.9.5实例分析 330

14.10图像大翻身 330

视频教学：5分钟 330

14.10.1基础知识——Invert滤镜与Xray滤镜 331

14.10.2实例描述 332

14.10.3实例应用 332

14.10.4运行结果 332

14.10.5实例分析 333

14.11实现镭射灯的效果 333

视频教学：4分钟 333

14.11.1基础知识——Light滤镜 333

14.11.2实例描述 334

14.11.3实例应用 334

14.11.4运行结果 335

14.11.5实例分析 336

14.12制作遮罩字 336

视频教学：3分钟 336

14.12.1基础知识——Mask滤镜 336

14.12.2实例描述 336

14.12.3实例应用 336

14.12.4运行结果 337

14.12.5实例分析 338

14.13图像淡入淡出 338

视频教学：5分钟 338

14.13.1基础知识——RevealTrans滤镜 338

14.13.2实例描述 339

14.13.3实例应用 339

14.13.4运行结果 340

14.13.5实例分析 341

14.14让图像产生波纹变形 341

视频教学：14分钟 341

14.14.1基础知识——Wave滤镜 341

14.14.2实例描述 343

14.14.3实例应用 343

14.14.4运行结果 344

14.14.5实例分析 345

14.15鼠标指针 345

视频教学：3分钟 345

14.15.1基础知识——鼠标指针 345

14.15.2实例描述 346

14.15.3实例应用 346

14.15.4运行结果 346

14.15.5实例分析 347

14.16常见问题解答 348

14.16.1对一个对象同时使用多个滤镜的问题 348

14.16.2 startx、starty、finishx、finishy参数是否重要 348

14.16.3 IE6中使用CSS滤镜后链接无法单击的问题 349

14.17习题 349

第15章 使用Dreamweaver提高工作效率 353

15.1使用Dreamweaver完成网站设计 354

视频教学：10分钟 354

15.1.1基础知识——使用Dreamweaver编写HTML信息 354

15.1.2基础知识——使用CSS面板创建样式 357

15.1.3实例描述 361

15.1.4实例应用 361

15.1.5运行结果 362

15.1.6实例分析 363

15.2将网站介绍页面样式保存至本地 363

视频教学：5分钟 363

15.2.1基础知识——保存CSS文件到本地站点 363

15.2.2实例描述 365

15.2.3实例应用 365

15.2.4运行结果 367

15.2.5实例分析 368

15.3为网站介绍页面添加背景颜色 368

视频教学：4分钟 368

15.3.1实例描述 368

15.3.2实例应用 368

15.3.3运行结果 370

15.3.4实例分析 370

15.4设置首页导航 371

视频教学：8分钟 371

15.4.1基础知识——插入菜单栏 372

15.4.2基础知识——编辑菜单栏 373

15.4.3实例描述 377

15.4.4实例应用 377

15.4.5运行结果 378

15.4.6实例分析 378

15.5制作导航简介 378

视频教学：5分钟 378

15.5.1基础知识——插入选项卡 378

15.5.2基础知识——编辑选项卡 379

15.5.3实例描述 380

15.5.4实例应用 380

15.5.5运行结果 381

15.5.6实例分析 381

15.6窗内公告 382

视频教学：5分钟 382

15.6.1基础知识——插入折叠式面板 382

15.6.2基础知识——自定义折叠面板 384

15.6.3实例描述 386

15.6.4实例应用 386

15.6.5运行结果 387

15.6.6实例分析 387

15.7用户注册 387

视频教学：7分钟 388

15.7.1实例描述 388

15.7.2实例应用 388

15.7.3运行结果 398

15.7.4实例分析 399

15.8常见问题解答 399

15.8.1将样式保存至本地服务器 399

15.8.2 Spry框架设置超链接 399

15.9习题 400

第16章 与XML整合 403

16.1创建简单的XML文件 404

视频教学：12分钟 404

16.1.1基础知识——创建XML文档 404

16.1.2实例描述 407

16.1.3实例应用 407

16.1.4实例分析 408

16.2在XML中引用外部CSS样式文件制作家电条幅 408

视频教学：7分钟 408

16.2.1基础知识——使用CSS显示XML中的数据 408

16.2.2实例描述 409

16.2.3实例应用 410

16.2.4运行结果 412

16.2.5实例分析 412

16.3在XML中嵌入CSS样式制作家电条幅 413

视频教学：7分钟 413

16.3.1基础知识——在XML中嵌入CSS样式 413

16.3.2实例描述 413

16.3.3实例应用 413

16.3.4运行结果 414

16.3.5实例分析 414

16.4实现学生信息的隔行变色功能 415

视频教学：7分钟 415

16.4.1基础知识——XML实现隔行变色的表格 415

16.4.2实例描述 416

16.4.3实例应用 416

16.4.4运行结果 418

16.4.5实例分析 419

16.5使用XSLT制作宠物展示页面 419

视频教学：6分钟 419

16.5.1基础知识——使用XSLT显示XML数据 419

16.5.2实例描述 421

16.5.3实例应用 421

16.5.4运行结果 423

16.5.5实例分析 423

16.6常见问题解答 424

16.6.1设置的CSS样式无效的问题 424

16.6.2为什么还要发展XML 424

16.6.3为什么要使用XML而不是HTML 425

16.6.4 XML如何与数据库连接 425

16.7习题 426

第17章 尽善尽美——合理使用JavaScript 429

17.1会变色的表格边框 430

视频教学：5分钟 430

17.1.1实例描述 430

17.1.2实例应用 430

17.1.3运行结果 431

17.1.4实例分析 431

17.2随着鼠标浮动的文字 431

视频教学：4分钟 432

17.2.1实例描述 432

17.2.2实例应用 432

17.2.3运行结果 433

17.2.4实例分析 434

17.3会闪的图片 434

视频教学：3分钟 434

17.3.1实例描述 434

17.3.2实例应用 434

17.3.3运行结果 435

17.3.4实例分析 435

17.4图片翻转 436

视频教学：4分钟 436

17.4.1实例描述 436

17.4.2实例应用 436

17.4.3运行结果 437

17.4.4实例分析 437

17.5舞动的文字 438

视频教学：4分钟 438

17.5.1实例描述 438

17.5.2实例应用 438

17.5.3运行结果 441

17.5.4实例分析 442

17.6会收缩的导航栏 442

视频教学：4分钟 442

17.6.1实例描述 442

17.6.2实例应用 443

17.6.3运行结果 445

17.6.4实例分析 445

17.7逐渐变色的表格 445

视频教学：4分钟 446

17.7.1实例描述 446

17.7.2实例应用 446

17.7.3运行结果 448

17.7.4实例分析 449

17.8常见问题解答 449

17.8.1 JavaScript的典型错误 449

17.8.2变量每秒自加1 449

17.8.3通过滤镜实现图片翻转的问题 450

17.9习题 451

第18章 CSS跨浏览器支持技术 453

18.1为特定浏览器提供不同的样式 454

视频教学：5分钟 454

18.1.1基础知识——条件注释 454

18.1.2实例描述 456

18.1.3实例应用 456

18.1.4运行结果 458

18.1.5实例分析 458

18.2解决空白边叠加问题 458

视频教学：5分钟 458

18.2.1基础知识——空白边叠加 459

18.2.2实例描述 460

18.2.3实例应用 460

18.2.4运行结果 462

18.2.5实例分析 462

18.3避免浮动元素闭合 462

视频教学：6分钟 462

18.3.1基础知识——闭合浮动元素 462

18.3.2实例描述 465

18.3.3实例应用 465

18.3.4运行结果 467

18.3.5实例分析 467

18.4选择合适的DOCTYPE 467

视频教学：11分钟 467

18.4.1基础知识——DOCTYPE的作用 467

18.4.2基础知识——定义DOCTYPE 469

18.4.3实例描述 470

18.4.4实例应用 470

18.4.5运行结果 471

18.4.6实例分析 471

18.5 CSS Bug 471

18.5.1校验CSS Bug 472

18.5.2捕捉Bug的基本步骤 473

18.6 CSS建议 475

18.7常见问题解答 478

18.7.1 CSS样式表显示问题 478

18.7.2 CSS固定div的兼容性问题 478

18.7.3简单菜单的兼容性 479

18.7.4 CSS在IE和FF中的兼容性问题 479

18.8习题 481

第19章 itzcn书店设计 483

19.1案例效果图分析 484

19.1.1划分页面主体框架 484

19.1.2分析顶部模块 485

19.1.3分析底部模块 486

19.1.4分析页面主体部分结构 486

19.2站点目录结构 488

19.3页面框架布局设计 488

19.4头部banner和菜单条的布局设计 491

19.5底部页面脚注的布局设计 493

19.6左侧主内容区域的详细设计 494

19.6.1“好书推荐”栏目样式设计 495

19.6.2“新书上架”栏目样式设计 498

19.7右侧辅助内容区域的详细设计 500

19.7.1“购物车”栏目样式设计 500

19.7.2“关于书店”栏目样式设计 501

19.7.3“优惠图书”栏目样式设计 502

19.7.4“图书分类”栏目样式设计 504

19.7.5“友情链接”栏目样式设计 506

19.8总结 506

第20章 设计微博首页 507

20.1系统分析 508

20.1.1最终效果预览 508

20.1.2结构分析 509

20.2准备工作 510

20.2.1创建站点结构 510

20.2.2定义页面结构 512

20.3设计顶部Logo展示模块 514

20.4设计底部版权展示模块 515

20.5设计左侧内容显示模块 517

20.5.1宣传广告 518

20.5.2热议话题 518

20.5.3会员列表和最新话题 521

20.6设计右侧边栏模块 527

20.6.1会员注册与登录入口 527

20.6.2会员关注排行榜 530

20.7总结 532

附录 参考答案 533