DIV+CSS网页样式与布局实录（CX-5992）PDF电子书下载

第1章 网页制作的准备工作 2

1.1认识几个基本概念 2

1.1.1网页和网站 2

1.1.2网页类型 2

1.1.3网页构成 5

1.2制作网站应该学习的知识 6

1.2.1学习HTML语言 6

1.2.2学习DIV构建网页结构 7

1.2.3学习CSS设置样式 8

1.2.4学习JavaScript控制动态效果 9

1.3提高自身的设计修养 10

1.3.1了解网页设计任务 10

1.3.2了解网页设计原则 10

1.3.3了解网页设计流程 11

1.3.4了解网页配色基本方法 11

1.4熟悉网站开发的基本流程 12

1.5准备上手的开发工具 14

1.5.1安装Dreamweaver 14

1.5.2使用Dreamweaver 15

1.5.3 Dreamweaver工作方式 16

1.5.4在Dreamweaver中编写CSS样式代码 18

1.6综合训练 21

1.6.1实训1：使用Dreamweaver定义一个本地站点 21

1.6.2实训2：使用Dreamweaver设计DIV结构 22

1.6.3实训3：使用Dreamweaver设计网页样式 24

1.7上机练习 28

第2章 HTML和XHTML基础 31

2.1认识HTML和XHTML 31

2.2 HTML基础 31

2.2.1 HTML概述 31

2.2.2 HTML文档结构 32

2.2.3 HTML基本语法 32

2.2.4 HTML标签 34

2.2.5 HTML属性 41

2.3 XHTML基础 43

2.3.1 XHTML概述 44

2.3.2 XHTML文档结构 44

2.3.3 XHTML基本语法 45

2.3.4 XHTML文档类型分类 46

2.3.5 XHTML文档类型详解 48

2.3.6 XHTML名字空间 50

2.4综合训练 51

2.4.1实训1：设计一个自我介绍简单页面 51

2.4.2实训2：解决网页乱码现象 52

2.4.3实训3：把HTML转换为XHTML 53

2.5上机练习 55

第3章 CSS基础 58

3.1 CSS概述 58

3.1.1什么是CSS样式 58

3.1.2为什么学习CSS 58

3.1.3 CSS的特点 59

3.2 CSS语法和用法 59

3.2.1 CSS基本结构 60

3.2.2 CSS基本用法 61

3.2.3 CSS样式表 62

3.2.4导入外部样式表 62

3.2.5 CSS注释和版式 63

3.3 CSS属性、属性值和单位 63

3.3.1 CSS属性 64

3.3.2 CSS单位 67

3.4基本选择器 70

3.4.1标签选择器 70

3.4.2类选择器 70

3.4.3 ID选择器 73

3.4.4通配选择器 75

3.5复合选择器 75

3.5.1子选择器 76

3.5.2相邻选择器 77

3.5.3包含选择器 78

3.5.4多层选择器嵌套 80

3.5.5属性选择器 81

3.5.6伪选择器和伪元素选择器 84

3.5.7选择器分组 85

3.6 CSS继承性、层叠性和特殊性 86

3.6.1 CSS继承性 86

3.6.2 CSS层叠性 88

3.6.3 CSS优先级 90

3.6.4 CSS特殊性 91

3.7综合训练 94

3.7.1实训1：设计个人网站菜单 94

3.7.2实训2：设计网站登录页面 96

3.8上机练习 98

第4章 设置字体和文字样式 102

4.1设置字体样式 102

4.1.1定义字体类型 102

4.1.2定义字体大小 103

4.1.3定义字体颜色 105

4.1.4定义字体粗细 106

4.1.5定义斜体字体 106

4.1.6定义下划线 107

4.1.7定义字体大小写 108

4.2设置文本样式 109

4.2.1定义文本对齐 109

4.2.2定义垂直对齐 111

4.2.3定义字距和词距 114

4.2.4定义行高 114

4.2.5定义缩进 117

4.3综合训练 118

4.3.1实训1：设计英文版式 119

4.3.2实训2：设计中文版式 121

4.4上机练习 125

第5章 设置超链接样式 128

5.1定义超链接样式 128

5.1.1认识超链接和路径 128

5.1.2认识伪类和伪对象 128

5.1.3定义超链接样式 129

5.2综合训练 131

5.2.1实训1：设计下划线样式 131

5.2.2实训2：设计立体样式 134

5.2.3实训3：设计滑动样式 135

5.3上机练习 137

第6章 定义图片和背景图像样式 140

6.1了解网页中的图像 140

6.2定义图片样式 140

6.2.1定义图片大小 140

6.2.2定义图片边框 141

6.2.3定义图片透明度 145

6.2.4定义图片对齐方式 146

6.3控制背景样式 148

6.3.1定义背景颜色 148

6.3.2定义背景图像 149

6.3.3定义背景图像显示方式 149

6.3.4定义背景图像显示位置 150

6.3.5定义背景图像固定显示 155

6.4综合训练 156

6.4.1实训1：设计项目图标 156

6.4.2实训2：设计图文混排版式 159

6.4.3实训3：设计博客主页 161

6.4.4实训4：设计电子相册主页 166

6.5上机练习 171

第7章 定义表格样式 174

7.1设计表格结构 174

7.1.1搭建表格基本结构 174

7.1.2设计表格附加结构 176

7.1.3表格结构分组 178

7.2定义表格样式 181

7.2.1定义表格边框样式 182

7.2.2定义单元格间距样式 183

7.2.3定义空单元格样式 185

7.3设计复杂表格样式 186

7.3.1使用CSS定义表格结构 186

7.3.2定义表格列和行的样式 189

7.3.3定义表格标题样式 192

7.3.4表格内样式的层叠顺序 194

7.4综合训练 196

7.4.1实训1：设计清新悦目的表格样式 196

7.4.2实训2：设计结构清晰的表格样式 199

7.5上机练习 202

第8章 定义表单样式 205

8.1设计表单结构 205

8.1.1定义表单框 205

8.1.2定义输入域 206

8.1.3定义选择域 209

8.1.4优化表单结构 212

8.2定义表单样式 213

8.2.1定义输入域样式 214

8.2.2定义选择域样式 217

8.2.3定义列表域样式 220

8.3综合训练 222

8.3.1实训1：设计用户登录表单 222

8.3.2实训2：设计用户注册表单 226

8.3.3实训3：设计搜索框 230

8.4上机练习 233

第9章 定义列表样式 236

9.1设计列表结构 236

9.1.1无序列表 236

9.1.2有序列表 237

9.1.3自定义列表 238

9.2定义列表样式 239

9.2.1设计项目符号类型 239

9.2.2设计项目符号显示位置 240

9.2.3自定义项目符号 241

9.2.4使用背景图像定义项目符号 242

9.3综合训练 243

9.3.1实训1：设计垂直导航菜单 243

9.3.2实训2：设计水平导航菜单 246

9.3.3实训3：设计滑动门菜单 248

9.3.4实训4：设计Tab分类展示面板 251

9.4上机练习 254

第10章 CSS网页布局和定位 258

10.1认识网页布局 258

10.1.1定义显示属性 258

10.1.2定义定位属性 261

10.1.3网页布局方式 262

10.2 CSS盒模型 262

10.2.1认识盒模型 262

10.2.2定义边界大小 263

10.2.3定义边框样式 266

10.2.4定义补白大小 269

10.3浮动布局 270

10.3.1浮动布局的基本用法 271

10.3.2清除浮动 272

10.4定位布局 274

10.4.1定位布局的基本用法 274

10.4.2定义定位层叠顺序 277

10.5综合训练 279

10.5.1实训1：设计网页居中显示 279

10.5.2实训2：设计自适应的网页定位布局 281

10.5.3实训3：设计等高网页布局 285

10.5.4实训4：设计负边界网页布局 288

10.6上机练习 290

第11章 DIV+CSS网页布局综合演练 294

11.1两列结构布局 294

11.1.1设计固定宽度布局 294

11.1.2设计宽度自适应布局 297

11.1.3设计自定义宽度布局 298

11.1.4设计多列等高布局 301

11.2多列结构布局 304

11.2.1设计两列定宽中间自适应布局 305

11.2.2设计右侧定宽左侧及中间自适应布局 306

11.2.3设计三列宽度自适应布局 307

11.3综合训练 308

11.3.1实训1：设计儿童博客首页 308

11.3.2实训2：设计新闻正文页 312

11.3.3实训3：设计企业宣传页面 315

11.4上机练习 317

第12章 DIV+CSS网页布局疑难杂症解惑 321

12.1解决CSS布局问题的一般方法 321

12.1.1使用过滤器 321

12.1.2使用IE条件语句 323

12.2常见CSS布局疑难问题解决方法 325

12.2.1了解浏览器默认样式 325

12.2.2列表序号无效了 325

12.2.3列表序号丢失了 326

12.2.4列表序号乱了 328

12.2.5列表项间距莫名其妙地增大了 329

12.2.6项目内容老错行显示 330

12.2.7定义元素高度无效 331

12.2.8元素宽度和高度计算错误 333

12.2.9不支持最小和最大尺寸 334

12.2.10看不到超链接中的图标了 336

12.2.11让超链接块状显示 337

12.2.12包含框没有被撑开 338

12.2.13包含框没有高度了 340

12.2.14部分栏目找不到了 341

12.2.15栏目为什么总是错行显示 343

12.2.16浮动元素为什么不能并列显示 344

12.2.17栏目之间多出了三个像素 345

12.2.18页面中突然多出了一个字符 346

12.2.19不能准确定位元素位置 347

12.2.20无法调整定位元素的层叠顺序 348

12.2.21找不到定位元素了 350

12.3综合训练 352

12.3.1实训1：设计幻灯片效果 352

12.3.2实训2：设计Tab选项卡效果 356

12.3.3实训3：设计CSS相册效果 360

12.4上机练习 363

第13章 企业&公司类型网站 366

13.1产品策划 366

13.2设计图 367

13.3切图 369

13.4网站重构 371

13.5网站布局 374

第14章 时尚娱乐类型网站 388

14.1产品策划 388

14.2设计图 389

14.3切图 391

14.4网站重构 394

14.5网站布局 396