《CSS+DIV网页样式与布局案例教程》PDF下载

  • 购买积分:12 如何计算积分?
  • 作  者:徐琴,张晓颖主编
  • 出 版 社:北京:航空工业出版社
  • 出版年份:2012
  • ISBN:9787516500569
  • 页数:309 页
图书介绍:本书通过案例介绍了利用CSS+DIV方式制作网页的技巧,涵盖网页制作基础、使用表格布局网页、设置网页内容等。

项目一 网站开发入门 1

项目导读 1

学习目标 1

任务一 了解网站开发流程 1

任务说明 1

任务实施 1

支撑知识点 4

一、网页、网站和主页 4

二、Internet、IP地址和域名 4

三、WWW、HTTP、URL和浏览器 5

任务二 创建Dreamweaver站点 5

任务说明 5

任务实施 6

支撑知识点 8

一、启动和退Dreamweaver 8

二、Dreamweaver工作界面介绍 9

三、新建和保存网页文档 14

四、打开、预览和关闭网页文档 15

任务三 制作简单的HTML+CSS页面 16

任务说明 16

任务实施 17

一、构建HTML结构 17

二、构建CSS样式 19

支撑知识点 20

一、HTML与CSS简介 20

二、HTML基础语法 21

三、网页的基本结构 23

四、静态页面与动态页面 25

五、网页的Web标准 25

项目总结 26

项目实训 26

项目二 HTML标签与CSS样式基础 28

项目导读 28

学习目标 28

任务一 制作鲜花导购网页的结构——HTML标签 28

任务说明 28

任务实施 29

支撑知识点 36

一、HTML标题、水平线、段落和换行 36

二、HTML列表 37

三、HTML图像 39

四、HTML超链接 40

任务二 修饰鲜花导购网页——CSS样式基础 42

任务说明 42

任务实施 43

支撑知识点 45

一、在HTML页面中引入CSS样式表的方法 45

二、选择器的类型 50

三、选择器的集体声明、嵌套与层叠 53

四、选择器的继承 54

项目总结 57

项目实训——制作个人主页 57

项目三 使用CSS设置文字效果项目导读 60

学习目标 60

任务一 制作个人博客首页——设置文字样式 60

任务说明 60

任务实施 60

支撑知识点 65

一、CSS文字样式常用属性 65

二、网页中元素的长度单位 67

三、为网页元素设置颜色的技巧 68

任务二 制作个人博客子页——设置段落和其他文字样式 69

任务说明 69

任务实施 69

支撑知识点 72

一、CSS段落和其他文字样式属性 72

二、HTML常用符号 74

任务三 制作个人博客排行榜——设置列表样式 74

任务说明 74

任务实施 75

支撑知识点 79

一、CSS列表样式常用属性 79

二、清除列表的默认边距 80

三、<div>与<span>标签补充讲解 80

四、块级元素与行内元素补充讲解 81

项目总结 81

项目实训——制作企业新闻网页 81

项目四 使用CSS设置图片效果与网页背景 84

项目导读 84

学习目标 84

任务一 制作休闲文章页面——设置图片效果 84

任务说明 84

任务实施 85

支撑知识点 88

一、设置图片和其他元素大小 89

二、设置图片和其他元素边框 89

三、设置图片的对齐方式 90

四、设置图文混排 91

任务二 制作童话故事页面——设置网页元素背景 91

任务说明 91

任务实施 92

支撑知识点 95

一、设置背景颜色 95

二、设置背景图片 95

项目总结 97

项目实训——制作旅游景点介绍网页 98

项目五 使用CSS设置导航栏 99

项目导读 99

学习目标 99

任务一 制作简单纵向导航栏 99

任务说明 99

任务实施 100

支撑知识点——使用CSS的一些小技巧 104

任务二 制作简单横向导航栏 105

任务说明 105

任务实施 105

任务三 制作带图片效果的横向导航栏 109

任务说明 109

任务实施 109

任务四 制作带下拉菜单的横向导航栏 113

任务说明 113

任务实施 113

支撑知识点——使用CSS的一些小技巧 121

项目总结 122

项目实训——制作3个不同的导航菜单 122

项目六 制作表格并使用CSS美化 124

项目导读 124

学习目标 124

任务一 制作2012年世界杯分组表——构建和美化表格 124

任务说明 124

任务实施 124

支撑知识点 130

一、表格的HTML标签 130

二、合并和拆分单元格 132

三、使用CSS设置表格或单元格颜色 133

四、使用CSS设置表格或单元格大小和边框 133

任务二 制作日历单元格——使用CSS控制表格进阶 133

任务说明 133

任务实施 134

支撑知识点 140

一、使用CSS设置网页元素的内边距和外边距 140

二、使用CSS合并表格边框 142

项目总结 143

项目实训——设计两个表格 143

项目七 制作表单并使用CSS美化 144

项目导读 144

学习目标 144

任务一 制作注册页面——表单的HTML结构 144

任务说明 144

任务实施 145

支撑知识点——常用的表单HTML标答 160

任务二 美化注册页面——使用CSS控制表单 162

任务说明 162

任务实施 163

支撑知识点——使用CSS定义表单样式 166

项目总结 167

项目实训——制作快递信息输入页面 167

项目八 CSS与浏览器兼容问题 169

项目导读 169

学习目标 169

任务一 无序列表的兼容性 169

任务二 浮动在IE下产生的双倍距离 171

任务三 在IE 6中图片下方有空隙产生 173

任务四 3像素问题 174

任务五 浏览器不能自适应高度 175

任务六 margin值加倍问题 178

支撑知识点 180

一、浏览器兼容性介绍 180

二、解决浏览器兼容性问题的小技巧 181

项目总结 181

项目九 CSS标准流布局——制作企业网站的新闻显示页面 182

项目导读 182

学习目标 183

任务一 对页面进行整体布局——盒子模型 183

任务说明 183

任务实施 183

支撑知识点——盒子模型的概念 186

任务二 制作页头部分——标准流布局概念 189

任务说明 189

任务实施 189

支撑知识点——标准流的概念 195

任务三 制作新闻正文显示部分 195

任务说明 195

任务实施 195

支撑知识点——margin使用注意事项 199

项目总结 201

项目实训 202

一、制作博客网站日志页面 202

二、制作企业简介页面 202

项目十 CSS浮动布局——制作企业网站新闻列表页面 204

项目导读 204

学习目标 205

任务一 对页面进行整体布局——浮动布局概念 205

任务说明 205

任务实施 205

支撑知识点 210

一、float和clear属性 210

二、浮动布局的原理 211

三、常用的浮动布局方法 212

四、清除浮动对布局的不良影响 214

五、浮动布局应用技巧 215

任务二 制作搜索栏目 218

任务说明 218

任务实施 218

任务三 制作新闻菜单 221

任务说明 221

任务实施 222

任务四 制作新闻列表 225

任务说明 225

任务实施 226

项目总结 231

项目实训 231

一、制作个人文集页面 231

二、制作博客网站主页 232

项目十一 CSS定位布局——制作企业网站首页 233

项目导读 233

学习目标 234

任务一 对页面进行整体布局——CSS定位属性 234

任务说明 234

任务实施 234

支撑知识点 240

一、认识CSS中的定位属性 240

二、CSS相对定位 241

三、CSS绝对定位 242

四、元素的堆叠顺序、溢出和剪裁 243

五、网页布局经验总结 244

任务二 制作图片新闻栏目 245

任务说明 245

任务实施 245

任务三 制作新闻列表栏目 250

任务说明 250

任务实施 250

任务四 制作企业首页的其他栏目 254

任务说明 254

任务实施 255

一、制作公司简介栏目 255

二、制作项目展示栏目 256

三、制作站内搜索栏目 257

项目总结 258

项目实训 258

一、制作博客网站日志页面 258

二、制作学校网站主页 259

项目十二 综合应用1——制作婚礼策划机构首页 260

项目导读 260

案例分析 261

任务一 搭建页面整体框架 261

一、整体布局分析 261

二、编写HTML代码 262

三、编写CSS代码 263

任务二 制作网页头部 267

一、模块分析 267

二、编写HTML代码 267

三、编写CSS代码 267

任务三 制作网页导航部分 268

一、模块分析 268

二、编写HTML代码 268

三、编写css代码 268

任务四 制作主体内容的上面部分 269

一、制作左边登录部分 270

1.模块分析 270

2.编写HTML代码 270

3.编写CSS代码 271

二、制作右边图片显示部分 272

任务五 制作主体内容的中间部分 272

一、制作左边婚礼资讯部分 272

1.模块分析 272

2.编写HTML代码 273

3.编写CSS代码 274

二、制作右边视频显示区 275

1.模块分析 275

2.编写HTML代码 275

3.编写CSS代码 276

任务六 制作主体内容的下面部分 276

一、模块分析 276

二、编写HTML代码 277

三、编写CSS代码 278

任务七 制作友情链接部分 279

一、模块分析 279

二、编写HTML代码 279

三、编写CSS代码 279

任务八 制作网页底部 280

项目十三 综合应用2——制作海南旅游网首页 282

项目导读 282

案例分析 283

任务一 搭建页面整体框架 283

一、整体布局分析 283

二、编写HTML代码 284

三、编写CSS代码 285

任务二 制作网页头部 288

一、模块分析 288

二、编写HTML代码 289

三、编写CSS代码 289

任务三 制作主体内容的上面部分 291

一、制作今日三亚栏目 291

1.模块分析 291

2.编写HTML代码 291

3.编写CSS代码 292

二、制作幻灯片广告部分 293

三、制作右边快捷按钮部分 293

1.模块分析 293

2.编写HTML代码 294

3.编写CSS代码 294

任务四 制作主体内容的下面部分 294

一、制作旅游资讯栏目 295

1.模块分析 295

2.编写HTML代码 295

3.编写CSS代码 296

二、制作推荐路线栏目 297

1.模块分析 297

2.编写HTML代码 298

3.编写CSS代码 299

三、制作酒店推荐栏目 301

1.模块分析 301

2.编写HTML代码 301

3.编写CSS代码 302

四、制作推荐景点栏目 304

1.模块分析 304

2.编写HTML代码 305

3.编写CSS代码 306

任务五 制作友情链接栏目 307

一、模块分析 307

二、编写HTML代码 307

三、编写CSS代码 307

任务六 制作页面底部 308

一、模块分析 308

二、编写HTML代码 309

三、编写CSS代码 309