《网页设计与网站建设案例课堂》 - 刘玉红、蒲娟 - 清华大学出版社 - 香港大書城

	登入帳戶　 \|　訂單查詢　 \|　購物車/收銀台( 0 )　\|　在線留言板　 \|　付款方式　 \|　運費計算　 \|　聯絡我們　 \|　幫助中心　\|　加入書簽
		會員登入新用戶登記

HOME

新書上架

暢銷書架

好書推介

2023年度TOP

臺灣用戶

品種：超過100萬種各類書籍/音像和精品，正品正價，放心網購，悭钱省心

服務：香港／台灣／澳門／海外

送貨：速遞／郵局／服務站

新書上架：簡體書繁體書
暢銷書架：簡體書繁體書
好書推介：簡體書繁體書

『簡體書』网页设计与网站建设案例课堂

書城自編碼： 2720452
分類：簡體書→大陸圖書→計算機/網絡→圖形圖像/多媒體
作者：刘玉红、蒲娟
國際書號(ISBN)： 9787302423546
出版社：清华大学出版社
出版日期： 2016-01-01
版次： 1 印次： 1
頁數/字數： 656/1009000
書度/開本： 16开釘裝：平装

售價：HK$ 118.5

我要買件

** 我創建的書架 **
未登入.

新書推薦：

《罗马政治观念中的自由》
售價：HK$ 50.4

《中国王朝内争实录：宠位厮杀》
售價：HK$ 61.6

《凡事发生皆有利于我（这是一本读了之后会让人运气变好的书”治愈无数读者的心理自助经典）》
售價：HK$ 44.6

《未来特工局》
售價：HK$ 55.8

《高术莫用（十周年纪念版逝去的武林续篇薛颠传世之作武学尊师李仲轩家世凸显京津地区一支世家的百年沉浮）》
售價：HK$ 54.9

《英国简史（刘金源教授作品）》
售價：HK$ 98.6

《便宜货：廉价商品与美国消费社会的形成》
售價：HK$ 77.3

《读书是一辈子的事（2024年新版）》
售價：HK$ 77.3

建議一齊購買：

HK$ 98.6
《Flash CC动画制作与设计实战从入门到精通（视频教学版》

HK$ 84.1
《PowerPoint 2013高效办公实战从入门到精通（视》

HK$ 94.3
《Excel 2013 人力资源管理实战从入门到精通（视频教》

HK$ 88.5
《Excel 2013公式、函数、图表与数据分析实战从入门到精》

HK$ 103.5
《JavaScript动态网站开发案例课堂》

HK$ 102.0
《Dreamweaver + PHP + MySQL 动态网站》

編輯推薦：

本书以零基础讲解为宗旨，用实例引导读者深入学习，采取“网站基础入门→静态网页制作→动态网站制作→网页美化布局→网页脚本→网页元素设计→网站开发实战→网站全能扩展”的讲解模式，深入浅出地讲解网页设计和网站建设的各项技术及实战技能。

本书适合任何想学习网页设计与网站建设知识的人员，无论读者是否从事计算机相关行业，是否接触过网页设计与网站建设，通过学习本书均可快速掌握网页设计与网站建设的方法和技巧。

內容簡介：

本书以零基础讲解为宗旨，用实例引导读者深入学习，采取“网站基础入门→静态网页制作→动态网站制作→网页美化布局→网页脚本→网页元素设计→网站开发实战→网站全能扩展”的讲解模式，深入浅出地讲解网页设计和网站建设的各项技术及实战技能。
本书适合任何想学习网页设计与网站建设知识的人员，无论读者是否从事计算机相关行业，是否接触过网页设计与网站建设，通过学习本书均可快速掌握网页设计与网站建设的方法和技巧。

目录
第1篇网站基础入门篇
第1章网站建设入门——网站与
网页的基本概念3
1.1 认识网页和网站4
1.1.1 什么是网页4
1.1.2 什么是网站4
1.1.3 网站的种类和特点5
1.2 网页的相关概念6
1.2.1 因特网6
1.2.2 万维网6
1.2.3 浏览器7
1.2.4 HTML7
1.2.5 URL7
1.2.6 域名7
1.2.7 IP地址8
1.2.8 上传与下载8
1.2.9 电子邮件8
1.2.10 FTP9
1.3 跟我练练手9
1.3.1 练习目标9
1.3.2 上机练习9
1.4 高手甜点9
第2章读懂网页密码——HTML
语言速成11
2.1 网页的HTML构成12
2.1.1 文档标签12
2.1.2 头部标签13
2.1.3 主体标签13
2.2 HTML常用标签14
2.2.1 标题标签h1～h614
2.2.2 段落标签p15
2.2.3 换行标签br16
2.2.4 链接标签a16
2.2.5 列表标签ul18
2.2.6 图像标签img20
2.2.7 表格标签table22
2.2.8 框架标签frame23
2.2.9 表单标签form25
2.2.10 注释标签!26
2.2.11 移动标签marquee27
2.3 实战演练——制作日程表28
2.4 跟我练练手31
2.4.1 练习目标31
2.4.2 上机练习31
2.5 高手甜点31
第3章第一视觉最重要——网页
色彩设计与搭配33
3.1 色彩基础知识34
3.1.1 认识色彩34
3.1.2 色彩的三属性34
3.1.3 216网页安全色36
3.2 网页色彩的搭配37
3.2.1 网页色彩的感觉37
3.2.2 网页色彩搭配原理42
3.2.3 网页色彩搭配技巧43
3.3 网站的色彩应用案例44
3.3.1 案例1——网络购物类网站
色彩应用44
3.3.2 案例2——游戏类网站色彩
应用45
3.3.3 案例3——企业门户网站色彩
应用46
3.3.4 案例4——时政新闻类网站
色彩应用46
3.3.5 案例5——影音类网站色彩
应用47
3.3.6 案例6——娱乐类网站色彩
应用48
3.4 跟我练练手48
3.4.1 练习目标48
3.4.2 上机练习48
3.5 高手甜点48
第4章开启网页制作之路——网站
建设基本流程与制作工具51
4.1 建站方式52
4.1.1 自助建站52
4.1.2 智能建站52
4.1.3 专业设计53
4.2 建站流程53
4.2.1 网站规划53
4.2.2 搜集资料54
4.2.3 制作网页54
4.2.4 网站测试55
4.2.5 申请域名55
4.2.6 申请空间55
4.2.7 网站备案55
4.2.8 发布网页57
4.2.9 网站推广和维护57
4.3 制作网页的常用软件58
4.3.1 网页布局软件
Dreamweaver CS658
4.3.2 图像处理软件
Photoshop CS658
4.3.3 动画制作软件Flash CS659
4.3.4 软件间的相互关系60
4.4 跟我练练手61
4.4.1 练习目标61
4.4.2 上机练习61
4.5 高手甜点62
第2篇静态网页制作篇
第5章磨刀不误砍柴工——使用
Dreamweaver CS6创建网站
站点65
5.1 认识Dreamweaver CS6的工作环境66
5.1.1 案例1——启动
Dreamweaver CS666
5.1.2 案例2——认识
Dreamweaver CS6的工作区67
5.1.3 案例3——熟悉
Dreamweaver CS6的面板69
5.2 创建站点71
5.2.1 案例4——创建本地站点71
5.2.2 案例5——使用【文件】面板
创建站点71
5.3 管理站点72
5.3.1 案例6——打开站点72
5.3.2 案例7——编辑站点73
5.3.3 案例8——删除站点73
5.3.4 案例9——复制站点74
5.4 操作站点文件及文件夹75
5.4.1 案例10——创建文件夹75
5.4.2 案例11——创建文件75
5.4.3 案例12——移动和复制文件
或文件夹76
5.4.4 案例13——删除文件或
文件夹77
5.5 实战演练——建立站点文件和
文件夹77
5.6 跟我练练手78
5.6.1 练习目标78
5.6.2 上机练习78
5.7 高手甜点79
第6章制作我的第一个网页——
网页内容之美81
6.1 文档的基本操作82
6.1.1 案例1——创建空白文档82
6.1.2 案例2——设置页面属性82
6.2 用文字美化网页86
6.2.1 案例3——插入文字86
6.2.2 案例4——设置字体88
6.2.3 案例5——设置字号89
6.2.4 案例6——设置字体颜色90
6.2.5 案例7——设置字体样式91
6.2.6 案例8——编辑段落93
6.2.7 案例9——检查拼写96
6.2.8 案例10——创建项目列表97
6.3 用图像美化网页99
6.3.1 案例11——插入图像99
6.3.2 案例12——设置图像属性101
6.3.3 案例13——设置图像的对齐
方式103
6.3.4 案例14——插入鼠标经过
图像103
6.3.5 案例15——插入图像占位符105
6.4 用动画美化网页106
6.4.1 案例16——插入Flash动画107
6.4.2 案例17——插入FLV视频107
6.5 用其他网页元素美化网页109
6.5.1 案例18——插入水平线109
6.5.2 案例19——插入日期110
6.5.3 案例20——插入特殊字符111
6.6 综合演练——制作图文并茂的网页112
6.7 跟我练练手114
6.7.1 练习目标114
6.7.2 上机练习114
6.8 高手甜点114
第7章不在网页中迷路——设计
网页超链接117
7.1 链接与路径118
7.1.1 链接的概念118
7.1.2 链接路径118
7.1.3 链接的类型120
7.2 添加网页超链接120
7.2.1 案例1——添加文本链接120
7.2.2 案例2——添加图像链接121
7.2.3 案例3——创建外部链接122
7.2.4 案例4——创建锚记链接122
7.2.5 案例5——创建图像热点
链接124
7.2.6 案例6——创建电子邮件
链接125
7.2.7 案例7——创建文件下载
链接126
7.2.8 案例8——创建空链接127
7.2.9 案例9——创建脚本链接127
7.3 案例10——链接的检查128
7.4 实战演练——为企业网站添加友情
链接129
7.5 跟我练练手130
7.5.1 练习目标130
7.5.2 上机练习130
7.6 高手甜点130
第8章让网页互动起来——使用
网页表单和行为131
8.1 在网页中插入表单元素132
8.1.1 案例1——插入表单域132
8.1.2 案例2——插入文本域133
8.1.3 案例3——插入单行文本域133
8.1.4 案例4——插入多行文本域133
8.1.5 案例5——插入密码域134
8.2 在网页中插入复选框和单选按钮134
8.2.1 案例6——插入复选框134
8.2.2 案例7——插入单选按钮135
8.3 在网页中插入表单136
8.3.1 案例8——插入下拉菜单136
8.3.2 案例9——插入滚动列表137
8.4 在网页中插入按钮137
8.4.1 案例10——插入按钮137
8.4.2 案例11——插入图像按钮138
8.5 添加网页行为139
8.5.1 案例12——打开【行为】
面板139
8.5.2 案例13——添加行为140
8.6 常用行为的应用140
8.6.1 案例14——交换图像141
8.6.2 案例15——弹出信息142
8.6.3 案例16——打开浏览器窗口143
8.6.4 案例17——检查表单144
8.6.5 案例18——设置状态栏文本146
8.7 实战演练——使用表单制作留言本147
8.8 跟我练练手150
8.8.1 练习目标150
8.8.2 上机练习150
8.9 高手甜点151
第9章批量制作风格统一的网页——
使用模板153
9.1 创建模板154
9.1.1 案例1——在空白文档中
创建模板154
9.1.2 案例2——在【资源】
面板中创建模板154
9.1.3 案例3——从现有文档创建
模板155
9.1.4 案例4——创建可编辑区域156
9.2 管理模板157
9.2.1 案例5——从模板中分离157
9.2.2 案例6——更新模板及基于
模板的网页158
9.3 实战演练——创建基于模板的页面159
9.4 跟我练练手160
9.4.1 练习目标160
9.4.2 上机练习160
9.5 高手甜点161
第3篇动态网站制作篇
第10章制作动态网站基础——
构建动态网站的执行环境165
10.1 准备互动网页的执行环境166
10.1.1 什么是PHP166
10.1.2 执行PHP的程序166
10.2 架设IIS+PHP的执行环境166
10.2.1 案例1——IIS网站服务器的
安装与设置166
10.2.2 案例2——在IIS网站
服务器上安装PHP169
10.3 架设Apache+PHP的执行环境171
10.3.1 案例3——Apache 网站
服务器的安装与设置171
10.3.2 案例4——在Apache网站
服务器上安装PHP175
10.4 MySQL 数据库的安装178
10.4.1 案例5——MySQL
数据库的安装178
10.4.2 案例6——phpMyAdmin
的安装180
10.5 实战演练——快速安装PHP集成
环境：AppServ 2.5181
10.6 跟我练练手183
10.6.1 练习目标183
10.6.2 上机练习183
10.7 高手甜点184
第11章架起动态网站的桥梁——
定义动态网站与使用
MySQL数据库185
11.1 定义一个互动网站186
11.1.1 定义互动网站的重要性186
11.1.2 案例1——在
Dreamweaver CS6中定义
网站186
11.2 MySQL数据库的使用189
11.2.1 数据库的原理190
11.2.2 案例2——数据库的建立191
11.3 在网页中使用MySQL数据库196
11.3.1 网页取得数据库的原理196
11.3.2 案例3——建立MySQL
数据库连接197
11.3.3 案例4——绑定记录集198
11.4 加密MySQL数据库200
11.4.1 MySQL数据库的安全问题200
11.4.2 案例5——为MySQL管理
账号加上密码201
11.5 实战演练——数据库的备份与还原202
11.6 跟我练练手204
11.6.1 练习目标204
11.6.2 上机练习204
11.7 高手甜点205
第12章开启动态网站制作之路——
动态网站应用模块开发207
12.1 网站模块的概念208
12.2 网站模块的使用208
12.2.1 案例1——程序源文件的
复制208
12.2.2 案例2——新建站点208
12.3 常用动态网站模块开发209
12.3.1 案例3——在线点播模块
开发209
12.3.2 案例4——网页搜索模块
开发210
12.3.3 案例5——在线支付模块
开发211
12.3.4 案例6——在线客服模块
开发212
12.3.5 案例7——天气预报模块
开发212
12.4 跟我练练手213
12.4.1 练习目标213
12.4.2 上机练习213
12.5 高手甜点214
第4篇网页美化布局篇
第13章读懂样式表密码——使用
CSS样式表美化网页217
13.1 认识CSS218
13.1.1 CSS概述218
13.1.2 CSS的作用218
13.1.3 基本CSS语法219
13.2 使用CSS样式美化网页219
13.2.1 案例1——使用字体样式
美化文字219
13.2.2 案例2——使用文本样式
美化文本222
13.2.3 案例3——使用背景样式
美化背景226
13.2.4 案例4——使用链接样式
美化链接229
13.2.5 案例5——使用列表样式
美化列表229
13.2.6 案例6——使用区块样式
美化区块231
13.2.7 案例7——使用宽高样式
设定宽高233
13.2.8 案例8——使用边框样式
美化边框234
13.3 使用CSS滤镜美化网页235
13.3.1 案例9——Alpha滤镜236
13.3.2 案例10——Blur滤镜238
13.3.3 案例11——Chroma滤镜239
13.3.4 案例12——DropShadow
滤镜240
13.3.5 案例13——FlipH滤镜和
FlipV滤镜241
13.3.6 案例14——Glow滤镜243
13.3.7 案例15——Gray滤镜243
13.3.8 案例16——Invert滤镜244
13.3.9 案例17——Mask滤镜244
13.3.10 案例18——Shadow滤镜245
13.3.11 案例19——Wave滤镜246
13.3.12 案例20——X-ray滤镜247
13.4 实战演练——设定网页中的链接
样式248
13.5 跟我练练手251
13.5.1 练习目标251
13.5.2 上机练习251
13.6 高手甜点251
第14章网页盒子模型——网页布局
的盒子技术253
14.1 盒子模型254
14.1.1 盒子模型的概念254
14.1.2 案例1——网页border区域
定义255
14.1.3 案例2——网页padding
区域定义256
14.1.4 案例3——网页margin
区域定义257
14.2 弹性盒模型260
14.2.1 案例4——盒子布局取向
?box-orient261
14.2.2 案例5——盒子布局顺序
?box-direction262
14.2.3 案例6——盒子布局位置
??box-ordinal-group264
14.2.4 案例7——盒子弹性空间
??box-flex265
14.2.5 案例8——管理盒子空间
??box-pack和box-align267
14.2.6 案例9——空间溢出管理
??box-lines269
14.3 盒子的定位与浮动270
14.3.1 案例10——相对定位271
14.3.2 案例11——绝对定位272
14.3.3 案例12——固定定位273
14.3.4 案例13——盒子的浮动274
14.4 实战演练——图文排版效果276
14.5 跟我练练手278
14.5.1 练习目标278
14.5.2 上机练习278
14.6 高手甜点279
第15章页面布局的黄金搭档——
CSS+DIV 布局典型范例281
15.1 使用CSS排版282
15.1.1 案例1——将页面用DIV
分块282
15.1.2 案例2——设置各块位置282
15.1.3 案例3——用CSS定位283
15.2 固定宽度网页剖析与布局285
15.2.1 案例4——网页单列布局
模式286
15.2.2 案例5——网页1-2-1型
布局模式289
15.2.3 案例6——网页1-3-1型
布局模式294
15.3 自动缩放网页1-2-1型布局模式298
15.3.1 案例7——1-2-1型等比例
变宽布局298
15.3.2 案例8——1-2-1型单列
变宽布局299
15.4 自动缩放网页1-3-1型布局模式300
15.4.1 案例9——1-3-1型三列
宽度等比例布局300
15.4.2 案例10——1-3-1型单侧列
宽度固定的变宽布局300
15.4.3 案例11——1-3-1型中间
列宽度固定的变宽布局304
15.4.4 案例12——1-3-1型双侧
列宽度固定的变宽布局308
15.4.5 案例13——1-3-1型中列和
侧列宽度固定的变宽布局312
15.5 实战演练——使用CSS设定网页
布局列的背景色315
15.6 跟我练练手317
15.6.1 练习目标317
15.6.2 上机练习317
15.7 高手甜点317
第5篇网页脚本篇
第16章读懂JavaScript代码的
前提——JavaScript脚本
基础321
16.1 认识JavaScript322
16.1.1 什么是JavaScript322
16.1.2 JavaScript的特点322
16.1.3 JavaScript与Java的区别323
16.1.4 JavaScript版本324
16.2 JavaScript的基本语法325
16.2.1 语句执行顺序325
16.2.2 区分大小写325
16.2.3 分号与空格326
16.2.4 对代码行进行折行326
16.2.5 注释326
16.2.6 语句328
16.2.7 语句块328
16.3 JavaScript的数据结构329
16.3.1 标识符330
16.3.2 关键字330
16.3.3 保留字330
16.3.4 常量331
16.3.5 变量331
16.4 JavaScript的数据类型333
16.4.1 案例1——typeof运算符334
16.4.2 案例2——Undefined类型335
16.4.3 案例3——Null类型335
16.4.4 案例4——Boolean类型336
16.4.5 案例5——Number类型337
16.4.6 案例6——String类型338
16.4.7 案例7——Object类型338
16.5 JavaScript的运算符339
16.5.1 案例8——算术运算符339
16.5.2 案例9——比较运算符340
16.5.3 案例10——位运算符342
16.5.4 案例11——逻辑运算符342
16.5.5 案例12——条件运算符344
16.5.6 案例13——赋值运算符345
16.5.7 案例14——运算符优先级346
16.6 JavaScript的表达式347
16.6.1 案例15——赋值表达式348
16.6.2 案例16——算术表达式349
16.6.3 案例17——布尔表达式349
16.6.4 案例18——字符串表达式350
16.6.5 案例19——类型转换351
16.7 实战演练——一个简单的
JavaScript实例352
16.8 跟我练练手353
16.8.1 练习目标353
16.8.2 上机练习353
16.9 高手甜点353
第17章改变程序执行方向——
程序控制结构与语句355
17.1 赋值语句356
17.2 条件判断语句356
17.2.1 案例1——if语句356
17.2.2 案例2——if…else语句357
17.2.3 案例3——if…else if语句358
17.2.4 案例4——if语句的嵌套359
17.2.5 案例5——switch语句360
17.3 循环控制语句362
17.3.1 案例6——while语句362
17.3.2 案例7——do…while语句363
17.3.3 案例8——for语句364
17.4 跳转语句365
17.4.1 案例9——break语句365
17.4.2 案例10——continue语句366
17.5 实战演练——在页面中显示距离
??2016年元旦节的天数366
17.6 跟我练练手368
17.6.1 练习目标368
17.6.2 上机练习368
17.7 高手甜点368
第18章 JavaScript代码中的密码——
函数369
18.1 函数简介370
18.2 函数的调用370
18.2.1 案例1——函数的简单调用370
18.2.2 案例2——在表达式中调用
函数371
18.2.3 案例3——在事件响应中
调用函数372
18.2.4 案例4——通过链接调用
函数373
18.3 JavaScript中常用的函数373
18.3.1 案例5——嵌套函数373
18.3.2 案例6——递归函数374
18.3.3 案例7——内置函数376
18.4 实战演练——购物简易计算器382
18.5 跟我练练手385
18.5.1 练习目标385
18.5.2 上机练习385
18.6 高手甜点385
第19章 JavaScript的核心内容——
内置对象387
19.1 字符串对象388
19.1.1 案例1——创建字符串对象
的方法388
19.1.2 案例2——字符串对象常用
属性的应用389
19.1.3 案例3——字符串对象常用
方法的应用390
19.2 数学对象394
19.2.1 案例4——创建Math对象394
19.2.2 案例5——数学对象属性的
应用395
19.2.3 案例6——数学对象方法的
应用396
19.3 日期对象401
19.3.1 案例7——创建日期对象401
19.3.2 案例8——日期对象常用
方法的应用403
19.3.3 案例9——日期对象间的
运算406
19.4 数组对象407
19.4.1 案例10——创建数组与
访问对象407
19.4.2 案例11——数组对象属性
的应用409
19.4.3 案例12——数组对象常用
方法的应用411
19.5 实战演练——制作网页随机
验证码415
19.6 跟我练练手416
19.6.1 练习目标416
19.6.2 上机练习416
19.7 高手甜点417
第6篇网页元素设计篇
第20章体现设计者的思想——使用
Photoshop CS6进行页面
设计421
20.1 熟悉Photoshop的常用工具422
20.1.1 案例1——缩放工具的使用422
20.1.2 案例2——抓手工具的使用422
20.1.3 案例3——选框工具的使用422
20.1.4 案例4——钢笔工具的使用423
20.1.5 案例5——套索工具的使用424
20.1.6 案例6——多边形套索工具
的使用425
20.1.7 案例7——磁性套索工具的
使用425
20.1.8 案例8——魔棒工具的使用426
20.1.9 案例9——快速选择工具的
使用426
20.1.10 案例10——渐变工具的
使用427
20.2 创建与保存网页文档429
20.2.1 案例11——创建网页文档429
20.2.2 案例12——保存网页文档430
20.3 网页的版面设计431
20.3.1 案例13——熟悉常用版面
布局样式431
20.3.2 案例14——在
Photoshop CS6中构建网页
结构433
20.4 实战演练——网页图像的切割434
20.5 跟我练练手436
20.5.1 练习目标436
20.5.2 上机练习436
20.6 高手甜点436
第21章让网页活灵活现——网页
元素设计基础437
21.1 网页图像堆叠之图层438
21.1.1 案例1——认识【图层】
面板438
21.1.2 案例2——图层的分类438
21.1.3 案例3——创建图层442
21.1.4 案例4——隐藏与显示图层443
21.1.5 案例5——对齐图层443
21.1.6 案例6——合并图层444
21.1.7 案例7——设置不透明度和
填充445
21.2 网页图像效果之图层样式447
21.2.1 案例8——光影效果447
21.2.2 案例9——浮雕效果450
21.2.3 案例10——叠加效果450
21.3 网页图像效果之蒙版452
21.3.1 案例11——剪贴蒙版452
21.3.2 案例12——快速蒙版454
21.3.3 案例13——图层蒙版456
21.3.4 案例14——矢量蒙版458
21.4 网页图像效果之通道459
21.4.1 案例15——复合通道459
21.4.2 案例16——颜色通道463
21.4.3 案例17——专色通道465
21.4.4 案例18——计算法通道467
21.5 一键制作网页图像效果之滤镜469
21.5.1 案例19——【镜头校正】
滤镜469
21.5.2 案例20——【消失点】
滤镜470
21.5.3 案例21——【风】滤镜472
21.5.4 案例22——【马赛克拼贴】
滤镜472
21.5.5 案例23——【旋转扭曲】
滤镜473
21.5.6 案例24——【模糊】滤镜474
21.5.7 案例25——【渲染】滤镜475
21.5.8 案例26——【艺术效果】
滤镜478
21.6 实战演练——校正偏红图片480
21.7 跟我练练手481
21.7.1 练习目标481
21.7.2 上机练习482
21.8 高手甜点482
第22章网页的标志——制作网站
Logo与Banner483
22.1 制作时尚空间感的文字Logo484
22.1.1 案例1——制作背景484
22.1.2 案例2——制作文字内容485
22.1.3 案例3——绘制自定义形状486
22.1.4 案例4——美化文字Logo487
22.2 制作网页图案Logo489
22.2.1 案例5——制作背景489
22.2.2 案例6——制作图案效果491
22.3 制作网页图文结合Logo493
22.3.1 案例7——制作网站Logo
中的图案493
22.3.2 案例8——制作网站Logo
中的文字495
22.4 制作网页英文Banner497
22.4.1 案例9——制作Banner
背景497
22.4.2 案例10——制作Banner
底纹498
22.4.3 案例11——制作文字特效499
22.5 制作网页中文Banner499
22.5.1 案例12——输入特效文字500
22.5.2 案例13——将输入的文字
设置为3D效果501
22.5.3 案例14——制作Banner
背景503
22.6 跟我练练手504
22.6.1 练习目标504
22.6.2 上机练习504
22.7 高手甜点504
第23章网站中的路标——制作网页
导航条507
23.1 网页导航条简介508
23.2 制作网页导航条508
23.2.1 案例1——制作横向导航条
框架508
23.2.2 案例2——制作斜纹509
23.2.3 案例3——制作纵向导航条511
23.3 跟我练练手513
23.3.1 练习目标513
23.3.2 上机练习513
23.4 高手甜点513
第24章网页中迷人的蓝海——制作
网页按钮与特效边线515
24.1 制作按钮516
24.1.1 制作普通按钮516
24.1.2 制作迷你按钮518
24.1.3 制作水晶按钮521
24.1.4 制作木纹按钮525
24.2 制作装饰边线529
24.2.1 制作装饰虚线529
24.2.2 制作分割线条531
24.2.3 制作斜纹区域532
24.3 跟我练练手534
24.3.1 练习目标534
24.3.2 上机练习534
24.4 高手甜点534
第25章让网页更绚丽——制作网站
常用动画特效537
25.1 了解Flash CS6538
25.1.1 绘制矢量图538
25.1.2 设计制作动画538
25.1.3 强大的编程功能539
25.2 认识图层与时间轴539
25.2.1 认识图层539
25.2.2 图层的基本操作540
25.2.3 认识【时间轴】面板543
25.2.4 【时间轴】面板的基本操作543
25.3 制作常用简单动画544
25.3.1 制作逐帧动画544
25.3.2 制作形状补间动画545
25.3.3 制作补间动画547
25.3.4 制作传统补间动画550
25.4 跟我练练手550
25.4.1 练习目标550
25.4.2 上机练习551
25.5 高手甜点551
第26章让网页不再单调——制作
动态网站Logo与Banner553
26.1 制作滚动文字Logo554
26.1.1 设置文档属性554
26.1.2 制作文字元件555
26.1.3 制作滚动效果555
26.2 制作动态产品Banner558
26.2.1 制作文字动画558
26.2.2 制作文字遮罩动画560
26.2.3 制作图片动画561
26.3 跟我练练手563
26.3.1 练习目标563
26.3.2 上机练习563
26.4 高手甜点563
第7篇网站开发实战篇
第27章娱乐休闲类网站开发实战567
27.1 网站分析及准备工作568
27.1.1 设计分析568
27.1.2 网站流程图568
27.1.3 数据库分析569
27.1.4 制作程序基本数据表570
27.2 网站结构分析570
27.3 网站主页面的制作571
27.3.1 管理站点571
27.3.2 网站主页面的制作过程571
27.4 网站二级页面的制作574
27.5 网站后台分析与讨论575
27.6 网站成品预览575
第28章电子商务类网站开发实战579
28.1 网站分析及准备工作580
28.1.1 设计分析580
28.1.2 网站流程图580
28.1.3 数据库分析580
28.1.4 制作程序基本数据表582
28.2 网站结构分析582
28.3 网站主页面的制作583
28.3.1 管理站点583
28.3.2 网站主页面的制作过程583
28.4 网站二级页面的制作585
28.4.1 企业新闻列表页585
28.4.2 企业产品展示列表页586
28.5 网站后台分析与讨论587
28.6 网站成品预览587
第29章适合手机预览的网站开发
实战591
29.1 网站设计分析592
29.2 网站结构分析592
29.3 网站主页面的制作592
29.4 网站成品预览594
第8篇网站全能扩展篇
第30章让别人浏览我的成果——
网站的测试与发布603
30.1 上传网站前的准备工作604
30.1.1 注册域名604
30.1.2 申请空间604
30.2 测试网站604
30.2.1 案例1——测试站点范围的
链接604
30.2.2 案例2——改变站点范围的
链接605
30.2.3 案例3——查找和替换606
30.2.4 案例4——清理文档607
30.3 发布网站608
30.3.1 案例5——使用
Dreamweaver发布网站608
30.3.2 案例6——使用FTP工具
上传网站610
30.4 跟我练练手612
30.4.1 练习目标612
30.4.2 上机练习612
30.5 高手甜点612
第31章保障网站正常运行——
网站安全与防御策略613
31.1 网站维护基础知识614
31.1.1 网站的维护与安全614
31.1.2 常见网站攻击方式615
31.2 网站安全防御策略616
31.2.1 案例1——检测上传文件的
安全性616
31.2.2 案例2——设置网站访问
权限618
31.3 跟我练练手619
31.3.1 练习目标619
31.3.2 上机练习619
31.4 高手甜点619
第32章增加点击率——网站优化与
推广621
32.1 在网站中添加广告622
32.1.1 网站广告的分类622
32.1.2 添加网站广告623
32.2 添加实用查询工具624
32.2.1 添加天气预报625
32.2.2 添加IP查询625
32.2.3 添加万年历626
32.2.4 添加列车时刻查询627
32.3 网站的宣传与推广628
32.3.1 网站宣传实用策略628
32.3.2 利用大众传媒进行推广629
32.3.3 利用网络媒介进行推广629
32.3.4 利用其他形式进行推广631
32.4 实战演练——查看网站的流量632
32.5 跟我练练手634
32.5.1 练习目标634
32.5.2 上机练习634
32.6 高手甜点634

內容試閱：

第2章读懂网页密码——HTML语言速成
HTML即超文本标记语言，是一种用来制作超文本文档的简单标记语言，是一种应用非常广泛的网页格式，也是被用来显示Web页面的语言之一。可以说，一个网页对应于一个HTML文件，HTML文件以.htm或.html为扩展名，可以使用任何能够生成TXT类型源文件的文本编辑器来编辑HTML文件。
本章要点已掌握的在方框中打钩
掌握网页的HTML结构。
掌握HTML常用的标签。
掌握制作日程表的步骤。
2.1 网页的HTML构成
在一个HTML文档中，必须包含HTMLHTML标签，并且放在一个HTML文档中的开始和结束位置，即每个文档以HTML开始，以HTML结束。HTMLHTML之间通常包含两个部分，分别是HEADHEAD和BODYBODY。HEAD标签中包含HTML头部信息，如文档标题、样式定义等。BODY标签中包含文档主体部分，即网页内容。需要注意的是，HTML标签不区分大小写。
为了便于读者从整体上把握HTML文档结构，下面通过一个HTML页面来介绍其整体结构，示例代码如下。
!DOCTYPE HTML
HTML
HEAD
TITLE网页标题TITLE
HEAD
BODY
网页内容
BODY
HTML
从上面的代码可以看出，一个基本的HTML页面由以下几个部分构成。
1??!DOCTYPE声明必须位于HTML5文档中的第一行，也就是位于HTML标签之前。该标签告知浏览器文档所使用的HTML规范。!DOCTYPE声明不属于HTML标签，它是一条指令，告诉浏览器编写页面所用的标签的版本。
2??HTMLHTML说明本页面使用HTML语言编写，使浏览器软件能够准确无误地解释、显示。
3??HEADHEAD是HTML的头部标签，头部信息不显示在网页中，在此标签内可以保护其他标签，用于说明文件标题和整个文件的一些公用属性。可以通过STYLE标签定义CSS样式表，通过SCRIPT标签定义JavaScript脚本文件。
4??TITLETITLE是HEAD中的重要组成部分，它包含的内容显示在浏览器的窗口标题栏中。如果没有TITLE，浏览器标题栏将显示页面的文件名。
5??BODYBODY包含HTML页面的实际内容，显示在浏览器窗口的客户区中。例如，页面中的文字、图像、动画、超链接以及其他HTML相关内容都定义在BODY标签中。
2.1.1 文档标签
基本HTML的页面以HTML标签开始，以HTML标签结束。HTML文档中的所有内容都应该在这两个标签之间。空结构在IE中的显示是空白的。
HTML标签的语法格式如下。
HTML
…
…
…
HTML
2.1.2 头部标签
头部标签HEAD…HEAD包含文档的标题信息，如标题、关键字、说明以及样式等。除了TITLE标题外，位于头部的内容一般不会直接显示在浏览器中，而是通过其他方式显示。
1. 内容
头部标签中可以嵌套多个标签，如TITLE、BASE、ISINDEX、SCRIPT等，也可以添加任意数量的属性，如SCRIPT、STYLE、META或OBJECT。除了TITLE外，其他嵌入标签可以使用多个。
2. 位置
在所有的HTML文档中，头部标签都不可或缺，但结束标签可省略。在各个HTML版本的文档中，头部标签后一直紧跟BODY标签，但在框架设置文档中，其后跟的是FRAMESET标签。
3. 属性
HEAD标签的属性PROFILE给出了元数据描写的位置，说明其中的META和LIND元素的特性，该属性的形式没有严格的格式规定。
2.1.3 主体标签
主体标签BODY…BODY包含文档的内容，用若干个属性来规定文档中显示的背景和颜色。
主体标签可能用到的属性如下。
* BACKGROUND=URL：文档的背景图像，URL指图像文件的路径。
* BGCOLOR=Color：文档的背景色。
* TEXT=Color：文本颜色。
* LINK=Color：链接颜色。
* VLINK=Color：已访问的链接颜色。
* ALINK=Color：被选中的链接颜色。
* ONLOAD=Script：文档已被加载。
* ONUNLOAD=Script：文档已退出。
为该标签添加属性的代码格式如下。
BODY BACKGROUND="URL " BGCOLOR="Color "
…
BODY
2.2 HTML常用标签
HTML文档是由标签组成的文档，要熟练掌握HTML文档的编写，首先就是了解HTML的常用标签。
2.2.1 标题标签h1～h6
在HTML文档中，文本的结构除了以行和段出现之外，还可以作为标题存在。通常一篇文档最基本的结构就是由若干不同级别的标题和正文组成。
HTML文档中包含有各种级别的标题，各种级别的标题由h1～h6元素来定义，h1～h6标题标签中的字母h是英文headline标题行的简称。其中h1代表1级标题，级别最高，文字也最大，其他标题元素依次递减，h6级别最低。
下面给出一个实例，来具体介绍标题标签的使用方法。
【例2.1】标题标签的使用实例文件：ch02\2.1.html。
html
head
title文本段换行title
head
body
h1这里是1级标题h1
h2这里是2级标题h2
h3这里是3级标题h3
h4这里是4级标题h4
h5这里是5级标题h5
h6这里是6级标题h6
body
html
将上述代码输入记事本，并以后缀名为.html的格式保存，然后在IE中预览效果，如图2-1所示。
图2-1 标题标签的使用
作为标题，它们的重要性是有区别的，其中h1标题的重要性最高，h6标题的重要性最低。2.2.2 段落标签p
段落标签p用来定义网页中的一段文本，文本在一个段落中会自动换行。段落标签是双标签，即pp，在p开始标签和p结束标签之间的内容形成一个段落。如果省略结束标签，从p标签开始，直到遇见下一个段落标签之前的文本，都在一个段落内。段落标签中的p是英文单词paragraph段落的首字母。
下面给出一个实例，来具体介绍段落标签的使用方法。
【例2.2】段落标签的使用实例文件：ch02\2.2.html。
html
head
title段落标签的使用title
head
body
p白雪公主与七个小矮人!p
p很久以前，白雪公主的后母——王后美貌盖世，但魔镜却告诉她世上唯有白雪公主最漂亮，王后怒火中烧，派武士把她押送到森林准备谋害，武士同情白雪公主，让她逃往森林深处。
p
p
小动物们用善良的心抚慰她，鸟兽们还把她领到一间小屋中，收拾完房间后她进入了梦乡。房子的主人是在外边开矿的七个小矮人，他们听了白雪公主的诉说后把她留在家中。
p
p
王后得知白雪公主未死，便用魔镜把自己变成一个老太婆，来到密林深处，哄骗白雪公主吃下一只有毒的苹果，使公主昏死过去。鸟儿识破了王后的伪装，飞到矿山报告白雪公主的不幸。七个小矮人火速赶回，王后仓皇逃跑，在狂风暴雨中跌下山崖摔死。
p
p
七个小矮人悲痛万分，把白雪公主安放在一只水晶棺里日日夜夜守护着她。邻国的王子闻讯，骑着白马赶来，爱情之吻使白雪公主死而复生。然后王子带着白雪公主骑上白马，告别了七个小矮人和森林中的动物，到王子的宫殿中开始了幸福的生活。
p
body
html
将上述代码输入记事本，并以后缀名为.html的格式保存，然后在IE中预览效果，如图2-2所示，可以看出p标签将文本分成标题与4个段落。
图2-2 段落标签的使用
2.2.3 换行标签br
使用换行标签br可以对文字强制换行，该标签是一个单标签，它没有结束标签，是英文单词break的缩写。一个br标签代表一个换行，连续的多个标签可以实现多次换行。使用换行标签时，在需要换行的位置添加br标签即可。
下面给出一个实例，来具体介绍换行标签的使用方法。
【例2.3】换行标签的使用实例文件：ch02\2.3.html。
html
head
title文本段换行title
head
body
清明br
清明时节雨纷纷br
路上行人欲断魂br
借问酒家何处有br
牧童遥指杏花村
body
html
将上述代码输入记事本，并以后缀名为.html的格式保存，然后在IE中预览效果，如图2-3所示。
图2-3 换行标签的使用
2.2.4 链接标签a
链接标签a是网页中最为常用的标签，主要用于把页面中的文本或图片链接到其他的页面、文本或图片。建立链接有两个最重要的要素，即设置为链接的网页元素和链接指向的目标地址。基本的链接结构如下。
a href=URL网页元素a
1. 文本和图片链接
设置链接的网页元素通常使用文本和图片。文本链接和图片链接是通过aa标签实现的，将文本或图片放在a开始标签和a结束标签之间即可建立文本或图片链接。
【例2.4】设置文本和图片链接实例文件：ch02\2.4.html。
打开记事本文件，在其中输入如下HTML代码。
html
head
title文本和图片链接title
head
body
a href="a.html"img src="imagesLogo.gif"a
a href="b.html"公司简介a
body
html
代码输入完成，将其保存为“链接.html”文件，然后双击该文件，就可以在浏览器中查看应用链接标签后的效果，如图2-4所示。
2. 电子邮件链接
电子邮件链接用来链接一个电子邮件的地址。下面是电子邮件链接可以使用的写法。
mailto:邮件地址
【例2.5】设置电子邮件链接实例文件：ch02\2.5.html。
打开记事本文件，在其中输入如下HTML代码。
html
head
title电子邮件链接title
head
body
使用电子邮件链接：a href="mailto:liule2012@163.com"链接a
body
html
代码输入完成，将其保存为“电子邮件链接.html”文件，然后双击该文件，就可以在浏览器中查看应用电子邮件链接后的效果。当单击含有链接的文本时，会弹出邮件发送窗口，如图2-5所示。

图2-4 文本与图片链接图2-5 电子邮件链接
2.2.5 列表标签ul
文字列表可以有序地编排一些信息资源，使其结构化和条理化，并以列表的样式显示出来，以便浏览者能更加快捷地获得相应信息。HTML中的文字列表如同文字编辑软件Word中的项目符号和自动编号。
1. 建立无序列表
无序列表相当于Word中的项目符号，无序列表的项目排列没有顺序，只以符号作为分项标识。无序列表使用一对标签ulul，其中每一个列表项使用lili，其结构如下。
ul
li无序列表项li
li无序列表项li
li无序列表项li
li无序列表项li
ul
在无序列表结构中，使用ulul标签表示这一个无序列表的开始和结束，li则表示一个列表项的开始。在一个无序列表中可以包含多个列表项，并且li可以省略结束标签。
下面给出的实例使用无序列表实现文本的排列显示。
【例2.6】建立无序列表实例文件：ch02\2.6.html。
打开记事本文件，在其中输入如下HTML代码。
html
head
title嵌套无序列表的使用title
head
body
h1网站建设流程h1
ul
li项目需求li
li系统分析
ul
li网站的定位li
li内容收集li
li栏目规划li
li网站目录结构设计li
li网站标志设计li
li网站风格设计li
li网站导航系统设计li
ul
li
li伪网页草图
ul
li制作网页草图li
li将草图转换为网页li
ul
li
li站点建设li
li网页布局li
li网站测试li
li站点的发布与站点管理 li
ul
body
html
代码输入完成，将其保存为“无序列表.html”文件，然后双击该文件，就可以在浏览器中查看应用无序列表后的效果了，如图2-6所示。读者会发现，在无序列表项中可以嵌套一个列表。如代码中的“系统分析”列表项和“伪网页草图”列表项中都有下级列表，因此在这对lili标签间又增加了一对ulul标签。
2. 建立有序列表
有序列表类似于Word中的自动编号功能。有序列表的使用方法和无序列表的使用方法基本相同，它使用标签olol，每一个列表项前使用lili。每个项目都有前后顺序之分，多数用数字表示，其结构如下。
ol
li第1项li
li第2项li
li第3项li
ol
下面给出的实例使用有序列表实现文本的排列显示。
【例2.7】建立有序列表实例文件：ch02\2.7.html。
打开记事本文件，在其中输入如下HTML代码。
html
head
title有序列表的使用title
head
body
h1本讲目标h1
ol
li网页的相关概念li
li网页与HTMLli
liWeb标准结构、表现、行为li
li网页设计与开发的过程li
li与设计相关的技术因素li
liHTML简介li
ol
body
html
代码输入完成，将其保存为“有序列表.html”文件，然后双击该文件，就可以在浏览器中查看应用有序列表后的效果，如图2-7所示。

　图2-6 无序列表图2-7 有序列表
2.2.6 图像标签img
图像可以美化网页，插入图像使用单标签img。img标签的属性及描述如表2-1所示。
表2-1 img标签的属性及描述
属性
值
描述
alt
text
定义有关图像的短的描述
src
URL
要显示的图像的URL
height
pixels %
定义图像的高度
ismap
URL
把图像定义为服务器端的图像映射
usemap
URL
定义作为客户端图像映射的一幅图像
width
pixels %
定义图像的宽度
1．插入图像
src属性用于指定图像源文件的路径，它是img标签必不可少的属性。其语法格式如下。
img src="图像路径"
图像路径可以是绝对路径，也可以是相对路径。
下面给出的实例将在网页中插入图像。
【例2.8】插入图像实例文件：ch02\2.8.html。
打开记事本文件，在其中输入如下HTML代码。
html
head
title插入图像title
head
body
img src="imagesmeishi.jpg"
body
html
代码输入完成，将其保存为“插入图像.html”文件，然后双击该文件，就可以在浏览器中查看插入图像后的效果，如图2-8所示。
2. 从不同位置插入图像
在插入图像时，用户可以将其他文件夹或服务器的图像插入到网页中。
【例2.9】从不同位置插入图像实例文件：ch02\2.9.html。
打开记事本文件，在其中输入如下HTML代码。
html
body
p
来自一个文件夹的图像：
img src="imagesmeishi.jpg"
p
p
来自baidu的图像：
img src="http:www.baidu.comimgshouye_b5486898c692066bd2cbaeda86d74448.gif"
p
body
html
代码输入完成，将其保存为“插入其他位置图像.html”文件，然后双击该文件，就可以在浏览器中查看插入图像后的效果，如图2-9所示。

　图2-8 插入图像图2-9 从不同位置插入图像
3. 设置图像在页面中的宽度和高度
在HTML文档中，还可以设置插入图像的显示大小。图像一般是按原始尺寸显示，但也可以任意设置显示尺寸。设置图像的宽度和高度分别使用属性width宽度和height高度。
【例2.10】设置图像在网页中的宽度和高度实例文件：ch02\2.10.html。
打开记事本文件，在其中输入如下HTML代码。
html
head
title插入图像title
head
body
img src="images01.jpg"
img src="images01.jpg" width="200"
img src="images01.jpg" width="200" height="300"
body
html
代码输入完成，将其保存为“设置图像大小.html”文件，然后双击该文件，就可以在浏览器中查看插入图像后的效果，如图2-10所示。
图2-10 设置图像的高度与宽度
由图2-10可以看到，图像的显示尺寸是由width宽度和height高度值控制的。当只为图像设置一个尺寸属性时，另外一个尺寸就以图像原始的长宽比例来显示。图像的尺寸单位可以选择百分比或数值。百分比为相对尺寸，数值为绝对尺寸。
在网页中插入的图像都是位图，放大尺寸时，图像中会出现马赛克，图像变得模糊。
在Windows中查看图像的尺寸，只需要找到图像文件，把鼠标指针移动到图像上，停留几秒后，就会出现一个提示框，说明图像文件的尺寸。尺寸后显示的数字代表图像的宽度和高度，如256×256。
2.2.7 表格标签table
在HTML中用于标识表格的标签如下。
* table标签用于标识一个表格对象的开始，table标签用于标识一个表格对象的结束。一个表格中只允许出现一对table标签。
* tr标签用于标识表格一行的开始，tr标签用于标识表格一行的结束。表格内有多少对trtr标签，就表示表格中有多少行。
* td标签用于标识表格某行中的一个单元格开始，td标签用于标识表格某行中的一个单元格结束。tdtd标签书写在trtr标签内，一对trtr标签内有多少对tdtd标签，就表示该行有多少个单元格。
最基本的表格必须包含一对tabletable标签、一对或几对trtr标签以及一对或几对tdtd标签。一对tabletable标签定义一个表格，一对trtr标签定义一行，一对tdtd标签定义一个单元格。
【例2.11】定义一个4行3列的表格实例文件：ch02\2.11.html。
打开记事本文件，在其中输入如下HTML代码。
html
head
title表格基本结构title
head
body
table border="1"
tr
tdA1td
tdB1td
tdC1td
tr
tr
tdA2td
tdB2td
tdC2td
tr
tr
tdA3td
tdB3td
tdC3td
tr
tr
tdA4td
tdB4td
tdC4td
tr
table
body
html
代码输入完成，将其保存为“表格.html”文件，然后双击该文件，就可以在浏览器中查看插入表格后的效果，如图2-11所示。
2.2.8 框架标签frame
框架通常用来定义页面的导航区域和内容区域。使用框架最常见的情况就是：一个框架用于显示包含导航栏的文档，而另一个框架用于显示含有内容的文档。框架是网页中最常用的页面设计方式，很多网站都使用了框架技术。
框架页面中最基本的内容就是框架集文件，它是整个框架页面的导航文件，其基本语法如下。
html
head
title框架页面的标题title
head
frameset
frame
frame
…
frameset
html
从上面的语法结构中可以看到，在使用框架的页面中，body主体标签被框架标签frameset所代替。而框架页面中包含的每一个框架，都是通过frame标签来定义的。
不能将bodybody标签与framesetframeset标签同时使用。不过，假如要添加包含一段文本的noframes标签，就必须将这段文本嵌套于bodybody标签内。
混合分割窗口是指在一个页面中，既有水平分割的框架，又有垂直分割的框架。其语法结构如下。
frameset rows="框架窗口的高度,框架窗口的高度,……"
frame
frameset cols="框架窗口的宽度,框架窗口的宽度,……"
frame
frame
…
frameset
frame
…
frameset
当然，也可以先进行垂直分割，再进行水平分割。其语法结构如下。
frameset cols="框架窗口的宽度,框架窗口的宽度,……"
frame
frameset rows="框架窗口的高度,框架窗口的高度,……"
frame
frame
…
frameset
frame
…
frameset
在设置框架窗口时，一定要注意窗口大小的设置与窗口个数的统一。
【例2.12】将一个页面分割成不同的框架实例文件：ch02\2.12.html。
打开记事本文件，在其中输入如下HTML代码。
html
head
title混合分割窗口title
head
frameset rows="30%,70%"
frame
frameset cols="20%,55%,25%"
frame
frame
frame
frameset
frameset
html
由代码可以看出，其首先将页面水平分割成上下两个窗口，接着下面的框架又被垂直分割成三个窗口。因此，下面的框架标签frame被框架集标签代替。运行程序，效果如图2-12所示。
图2-12 框架标签的使用
2.2.9 表单标签form
表单主要用于收集网页浏览者的相关信息，其标签为formform。表单标签的基本语法格式如下。
form action="url" method="get|post" enctype="mime"
form
其中，action="url"指明提交表单时向何处发送数据，它可以是一个URL地址或一个电子邮件地址。method="get?|?post"指明提交表单的HTTP方法。enctype="mime"指明在把表单提交给服务器之前如何对表单进行编码。表单是一个能够包含表单元素的区域。通过添加不同的表单元素，将显示不同的效果。
下面给出一个具体的实例，即开发一个简单的网站用户意见反馈页面。
【例2.13】用户意见反馈页面实例文件：ch02\2.13.html。
打开记事本文件，在其中输入如下HTML代码。
html
head
title用户意见反馈页面title
head
body
h1 align=center用户意见反馈页面h1
form method="post"
p姓nbsp;nbsp;nbsp;nbsp;名：
input type="text" class=txt size="12" maxlength="20" name="username"
pp性nbsp;nbsp;nbsp;nbsp;别：
input type="radio" value="male"男
input type="radio" value="female"女
pp年nbsp;nbsp;nbsp;nbsp;龄：
input type="text" class=txt name="age"
p
p联系电话：
input type="text" class=txt name="tel"
pp电子邮件：
input type="text" class=txt name="email"
pp联系地址：
input type="text" class=txt name="address"
p
p
请输入您对网站的建议br
textarea name="yourworks" cols ="50" rows = "5"textarea
br
input type="submit" name="submit" value="提交"
input type="reset" name="reset" value="清除"
p
form
body
html
代码输入完成，将其保存为“表单.html”文件，然后双击该文件，就可以在浏览器中查看插入表单后的效果，如图2-13所示。可以看到页面中创建了一个用户意见反馈表单，包含标题，以及【姓名】、【性别】、【年龄】、【联系电话】、【电子邮件】、【联系地址】、【请输入您对网站的建议】等选项。
图2-13 表单标签的使用
2.2.10 注释标签!
注释是在HTML代码中插入的描述性文本，用来解释该代码或提示其他信息。注释只出现在代码中，浏览器对注释代码不进行解释，并且在浏览器的页面中不显示。在HTML源代码中适当地插入注释语句是一种非常好的习惯。对于设计者日后的代码修改、维护工作很有好处。另外，如果将代码交给其他设计者，其他人也能很快读懂原作者所撰写的内容。
注释标签的语法结构如下。
!--注释的内容--
注释语句元素由前后两半部分组成，前半部分包括一个左尖括号、一个半角感叹号和两个连字符头，后半部分包括两个连字符和一个右尖括号。下面给出一个例子。
html
head
title标记测试title
head
body
!-- 这里是标题--
h1网站建设精讲h1
body
html
页面注释不但可以对HTML中一行或多行代码进行解释说明，而且可以注释掉这些代码。如果希望某些HTML代码在浏览器中不显示，可以将这部分内容放在“!--”和“--”之间。例如，修改上述代码，如下所示。
html
head
title标签测试title
head
body
!--
h1网站建设精讲h1
--
body
html
修改后的代码，将h1标签作为注释内容处理，在浏览器中将不会显示这部分内容。
2.2.11 移动标签marquee
使用marquee标签可以将文字设置为动态滚动的效果。其语法结构如下。
marquee滚动文字marquee
只要在标签之间添加要进行滚动的文字即可，而且可以在标签之间设置这些文字的字体、颜色等。
【例2.14】制作一个滚动的文字实例文件：ch02\2.14.html。
打开记事本文件，在其中输入如下HTML代码。
html
head
title设置滚动文字title
head
body
marquee
font face="隶书" color="#CC0000" size=4你好，欢迎光临五月蔷薇女裤专卖店!这里有最适合你的打底裤，这里有最让你满意的服务font
marquee
body
html
代码输入完成，将其保存为“滚动文字.html”文件，然后双击该文件，就可以在浏览器中查看滚动文字的效果，如图2-14所示，可以看到设置为红色隶书的文字从浏览器的右方缓缓向左滚动。
图2-14 滚动标签的使用
2.3 实战演练——制作日程表
通过在记事本中输入HTML语言，可以制作出多种多样的页面效果。本节以制作日程表为例，介绍HTML语言的综合应用方法。
具体操作步骤如下。
打开记事本，在其中输入如下代码，如图2-15所示。
html
head
META http-equiv="Content-Type" content="texthtml; charset=gb2312"
title制作日程表title
head
body
body
html
图2-15 在记事本中输入代码
在head标签之前输入如下代码，如图2-16所示。
style type="textcss"
body {
background-color: #FFD9D9;
text-align: center;
}
style
在style标签之前输入如下代码，如图2-17所示。
.ziti {
font-family: "方正粗活意简体", "方正大黑简体";
font-size: 36px;
}

　图2-16 在记事本中输入代码图2-17 在记事本中输入代码
在body…body标签之间输入如下代码，如图2-18所示。
span class="ziti"一周日程表span
在body标签之前输入如下代码，如图2-19所示。
table width="470" border="1" align="center" cellpadding="2" cellspacing="3"
tr
td width="84" style="text-align: center"nbsp;td
td width="84" style="text-align: center"工作一td
td width="86" style="text-align: center"工作二td
td width="83" style="text-align: center"工作三td
td width="83" style="text-align: center"工作四td
tr
tr
td style="text-align: center; font-family: ''宋体'';"星期一td
td style="text-align: center"nbsp;td
td style="text-align: center"nbsp;td
td style="text-align: center"nbsp;td
td style="text-align: center"nbsp;td
tr
tr
td style="text-align: center; font-family: ''宋体'';"星期二td
td style="text-align: center"nbsp;td
td style="text-align: center"nbsp;td
td style="text-align: center"nbsp;td
td style="text-align: center"nbsp;td
tr
tr
td style="text-align: center; font-family: ''宋体'';"星期三td
td style="text-align: center"nbsp;td
td style="text-align: center"nbsp;td
td style="text-align: center"nbsp;td
td style="text-align: center"nbsp;td
tr
tr
td style="text-align: center; font-family: ''宋体'';"星期四td
td style="text-align: center"nbsp;td
td style="text-align: center"nbsp;td
td style="text-align: center"nbsp;td
td style="text-align: center"nbsp;td
tr
tr
td style="text-align: center; font-family: ''宋体'';"星期五td
td style="text-align: center"nbsp;td
td style="text-align: center"nbsp;td
td style="text-align: center"nbsp;td
td style="text-align: center"nbsp;td
tr
table

图2-18 在记事本中输入代码图2-19 在记事本中输入代码
在记事本中选择【文件】→【保存】菜单命令，弹出【另存为】对话框，设置保存的位置，并设置【文件名】为“制作日程表.html”，然后单击【保存】按钮，如图2-20所示。
双击打开保存的文件，即可看到制作的日程表，如图2-21所示。

图2-20 【另存为】对话框图2-21 制作的日程表
如果需要在日程表中添加工作内容，可以用记事本打开文件，在td style="text-align: center"nbsp;td的nbsp之前输入内容即可。比如要输入星期一完成的第1件工作内容“完成校对”，可以在如图2-22所示的位置输入。
保存后打开文件，即可看到添加的工作内容，如图2-23所示。

图2-22 在记事本中输入代码图2-23 修改后的日程表
2.4 跟我练练手
2.4.1 练习目标
能够熟练掌握本章所讲内容。
2.4.2 上机练习
练习1：HTML常用标签的使用。
练习2：制作日程表。
2.5 高手甜点
甜点1：HTML5中的单标签和双标签书写方法
HTML5中的标签分为单标签和双标签。单标签没有结束标签；双标签既有开始标签，又有结束标签。
对于单标签，不允许给其添加结束标签，只允许使用“元素 ”的形式进行书写。例如“br…br”的书写方式是错误的，正确的书写方式为br 。当然，在HTML5之前的版本中，br这种书写方式可以被沿用。HTML5中不允许写结束标签的元素有：area、base、br、col、command、embed、hr、img、input、keygen、link、meta、param、source、track、wbr。
对于部分双标签，可以省略其结束标签。HTML5中允许省略结束标签的元素有：li、dt、dd、p、rt、rp、optgroup、option、colgroup、thead、tbody、tfoot、tr、td、th。
在HTML5中，有些元素还可以完全被省略。即使被省略了，该元素还是以隐式的方式存在。HTML5中允许省略全部标签的元素有：html、head、body、colgroup、tbody。
甜点2：使用记事本编辑HTML文件的注意事项
很多初学者在保存文件时，没有将HTML文件的扩展名.html或.htm作为文件的后缀，导致文件还是以.txt为扩展名，因此无法在浏览器中查看。如果读者是通过右键快捷菜单创建记事本文件的，在给文件重命名时，一定要以.html或.htm作为文件的后缀。特别要注意的是，当Windows系统被设置为隐藏文件的扩展名时，更容易出现这样的错误。读者可以在【文件夹选项】对话框中查看是否允许显示扩展名。

書城介紹　 \|　合作申請　\|　索要書目　 \|　新手入門　\|　聯絡方式　 \|　幫助中心　\|　找書說明　 \|　送貨方式　\|　付款方式	香港用户　 \|　台灣用户　\|　大陸用户　\|　海外用户

	megBook.com.hk
Copyright © 2013 - 2024 （香港）大書城有限公司　 All Rights Reserved.