本书紧密围绕网页设计师在网页制作过程中的实际需要和应该掌握的技术，全面地介绍了使用 HTML、CSS进行网页设计和制作的各方面内容和技巧。本书不只注重语法讲解，还通过一个个鲜活、典型 的实战案例来帮助读者达到学以致用的目的。每个语法都有相应的实例，每章后面又配有综合小实例，各 章均配有习题，力求达到理论知识与实践操作完美结合的效果。 本书可作为普通高校、高职高专计算机及相关专业教材，并可供从事网页设计与制作、网站开发、网 页编程等行业人员参考。
第1篇 HTML篇第1课 HTML入门1.1 什么是HTML 21.2 HTML文件的基本结构 21.2.1 HTML文件结构 21.2.2 编写HTML文件注意事项 31.3 HTML文件编写方法 41.3.1 课堂小实例——使用记事本编写HTML页面 41.3.2 课堂小实例——使用
Dreamweaver编写HTML页面 51.4 HTML页面主体常用设置 51.4.1 课堂小实例——定义网页背景色（bgcolor） 51.4.2 课堂小实例——设置背景图片（background） 61.4.3 课堂小实例——设置文字颜色（text） 71.4.4 课堂小实例——设置链接文字属性 81.4.5 课堂小实例——设置页面边距 101.5 页面头部元素<head>和<!DOCTYPE> 101.6 页面标题元素<title> 111.7 元信息元素<meta> 111.7.1 课堂小实例——设置页面描述 121.7.2 课堂小实例——定义页面的搜索方式 121.7.3 课堂小实例——定义页面的跳转 131.7.4 课堂小实例——设置页面关键字 141.8 综合实战——创建基本的HTML文件 141.9 课后练习 151.10 本课小结 16第2课 用HTML设置文字与段落格式2.1 插入其他标记 182.1.1 课堂小实例——输入空格符号 182.1.2 输入特殊符号 192.2 设置文字的格式 192.2.1 课堂小实例——设置字体（face） 192.2.2 课堂小实例——设置字号（size） 202.2.3 设置文字颜色（color） 212.2.4 设置粗体、斜体、下划线（b、strong、em、u） 222.2.5 设置上标与下标（sup、sub） 232.2.6 多种标题样式的使用（<h1>～<h6>） 242.3 设置段落的排版与换行 242.3.1 给文字进行分段（p） 252.3.2 段落的对齐属性（align） 252.3.3 不换行标记（nobr） 262.3.4 换行标记（br） 272.4 水平线标记 282.4.1 插入水平线（hr） 282.4.2 设置水平线宽度与高度属性（width、size） 292.4.3 设置水平线的颜色（color） 302.4.4 设置水平线的对齐方式（align） 312.4.5 水平线去掉阴影（noshade） 312.5 设置滚动文字 322.5.1 滚动文字标签——marquee 322.5.2 滚动方向属性——direction 332.5.3 滚动方式属性——behavior 342.5.4 滚动速度属性——scrollamount 352.5.5 滚动延迟属性——scrolldelay 362.5.6 滚动循环属性——loop 372.5.7 滚动范围属性——width、height 372.5.8 滚动背景颜色属性——bgcolor 382.5.9 滚动空间属性——hspace、vspace 392.6 综合实例——设置页面文本及段落 402.7 课后练习 422.8 本课小结 42第3课 用HTML创建精彩的图像和
多媒体页面3.1 网页中常见的图像格式 443.2 插入图像并设置图像属性 443.2.1 图像标记：img 443.2.2 课堂小实例——设置图像高度（height） 453.2.3 课堂小实例——设置图像宽度（width） 463.2.4 课堂小实例——设置图像的边框（border） 463.2.5 课堂小实例——设置图像水平间距（hspace） 473.2.6 课堂小实例——设置图像垂直间距（vspace） 483.2.7 课堂小实例——设置图像的对齐方式（align） 493.2.8 课堂小实例——设置图像的替代文字（alt） 503.3 添加多媒体文件 513.3.1 课堂小实例——添加多媒体文件标记（embed） 523.3.2 课堂小实例——设置自动运行（autostart） 523.4 添加背景音乐 533.4.1 课堂小实例——设置背景音乐（bgsound） 533.4.2 课堂小实例——设置循环播放次数（loop） 543.5 综合实例 553.5.1 实例1——创建多媒体网页 553.5.2 实例2——创建图文混合排版网页 563.6 课后练习 573.7 本课小结 58第4课 用HTML创建超链接4.1 链接和路径 604.1.1 超链接的基本概念 604.1.2 课堂小实例——路径url 604.1.3 课堂小实例——HTTP路径 614.1.4 课堂小实例——FTP路径 624.1.5 课堂小实例——邮件路径 624.2 链接元素<a> 634.2.1 课堂小实例——指定路径href 634.2.2 显示链接目标属性target 644.2.3 链接的热键属性
Accesskey 654.3 创建图像的超链接 674.3.1 课堂小实例——创建链接区域元素<map> 674.3.2 链接区域的名称属性name 674.3.3 定义鼠标敏感区元素<area> 684.3.4 链接的路径属性href、nohref 694.3.5 鼠标敏感区坐标属性coords 704.4 下载文件 714.5 实战应用——给网页添加链接 724.6 课后练习 744.7 本课小结 75第5课 使用HTML创建强大的表格5.1 创建并设置表格属性 775.1.1 课堂小实例——表格的基本标记（table、tr、td） 775.1.2 课堂小实例——表格宽度和高度（width、height） 785.1.3 课堂小实例——表格的标题（caption） 785.1.4 课堂小实例——表格的表头（th） 795.1.5 课堂小实例——表格对齐方式（align） 805.1.6 表格的边框宽度（border） 815.1.7 表格边框颜色（bordercolor） 825.1.8 单元格间距（cellspacing） 835.1.9 单元格边距（cellpadding） 835.1.10 表格的背景色（bgcolor） 855.1.11 表格的背景图像（background） 865.2 表格的结构标记 875.2.1 课堂小实例——设计表头样式（thead） 875.2.2 课堂小实例——设计表主体样式（tbody） 885.2.3 课堂小实例——设计表尾样式（tfoot） 885.3 综合实例——使用表格排版网页 905.4 课后练习 945.5 本课小结 94第6课 创建交换式表单6.1 表单元素<form> 966.1.1 课堂小实例——动作属性（action） 966.1.2 课堂小实例——发送数据方式属性（method） 966.1.3 课堂小实例——名称属性（name） 976.2 表单的控件<input> 976.2.1 课堂小实例——文本域text 986.2.2 课堂小实例——密码区域password 996.2.3 课堂小实例——提交按钮submit 1006.2.4 课堂小实例——复位按钮reset 1006.2.5 课堂小实例——图像按钮image 1016.2.6 课堂小实例——单击按钮button 1026.2.7 课堂小实例——复选框checkbox 1026.2.8 课堂小实例——单选按钮radio 1036.2.9 课堂小实例——隐藏区域hidden 1046.3 综合实战——用户注册表单页面实例 1056.4 课后练习 1096.5 本课小结 110第7课 HTML 5的新特性7.1 认识HTM 5 1127.2 HTML 5的新特性 1147.3 HTML 5与HTML 4的区别 1157.3.1 HTML 5的语法变化 1157.3.2 HTML 5中的标记方法 1157.3.3 HTML 5语法中的3个要点 1167.3.4 HTML 5与HTML 4在
搜索引擎优化的对比 1167.4 HTML 5新增的元素和废除的元素 1177.4.1 课堂小实例——新增的结构元素 1177.4.2 课堂小实例——新增的块级的语义元素 1187.4.3 课堂小实例——新增的行内的语义元素 1207.4.4 课堂小实例——新增的嵌入多媒体元素与交互性元素 1237.4.5 课堂小实例——新增的input元素的类型 1247.4.6 废除的元素 1257.5 新增的属性和废除的属性 1267.5.1 新增的属性 1267.5.2 废除的属性 1277.6 课后练习 1297.7 本课小结 129第8课 HTML 5的结构8.1 新增的主体结构元素 1318.1.1 课堂小实例——article元素 1318.1.2 课堂小实例——section元素 1328.1.3 课堂小实例——nav元素 1338.1.4 课堂小实例——aside元素 1368.2 新增的非主体结构元素 1368.2.1 课堂小实例—— header元素 1368.2.2 课堂小实例——hgroup元素 1378.2.3 课堂小实例——footer元素 1388.2.4 课堂小实例——address元素 1398.3 课后练习 1408.4 本课小结 141第2篇 CSS篇第9课 CSS基础知识9.1 CSS 3介绍 1439.1.1 CSS基本概念 1439.1.2 CSS的优点 1439.1.3 CSS 3功能 1449.1.4 CSS 3发展历史 1459.2 在HTML 5中使用CSS的方法 1459.2.1 行内样式 1459.2.2 内嵌样式 1469.2.3 链接样式 1469.2.4 导入样式 1479.2.5 优先级问题 1479.3 选择器类型 1489.3.1 课堂小实例——标签选择器 1489.3.2 课堂小实例——类选择器 1489.3.3 课堂小实例——ID选择器 1499.4 编辑和浏览CSS 1519.4.1 手工编写CSS 1519.4.2 Dreamweaver编写CSS 1519.5 使用Dreamweaver设置CSS样式 1529.5.1 设置文本样式 1529.5.2 设置背景样式 1539.5.3 设置区块样式 1559.5.4 设置方框样式 1569.5.5 设置边框样式 1579.5.6 设置列表样式 1589.5.7 设置定位样式 1599.5.8 设置扩展样式 1619.5.9 过渡样式的定义 1619.6 实战应用——对网页添加CSS样式 1619.7 课后练习 1649.8 本课小结 164第10课 CSS控制网页文本和段落样式10.1 通过CSS控制文本样式 16610.1.1 课堂小实例——字体font-family 16610.1.2 课堂小实例——字号font-size 16710.1.3 课堂小实例——加粗字体font-weight 16810.1.4 课堂小实例——字体风格font-style 16910.1.5 课堂小实例——小写字母转为大写字母font-variant 17010.2 通过CSS控制段落格式 17110.2.1 课堂小实例——单词间隔word-spacing 17110.2.2 课堂小实例——字符间隔letter-spacing 17110.2.3 课堂小实例——文字修饰text-decoration 17210.2.4 课堂小实例——垂直对齐方式vertial-align 17310.2.5 课堂小实例——文本转换text-transform 17310.2.6 课堂小实例——水平对齐方式text-align 17410.2.7 课堂小实例——文本缩进text-indent 17510.2.8 课堂小实例——文本行高line-height 17510.2.9 课堂小实例——处理空白white-space 17610.3 滤镜 17710.3.1 课堂小实例——不透明度alpha 17810.3.2 课堂小实例——动感模糊blur 17910.3.3 课堂小实例——对颜色进行透明处理chroma 18010.3.4 课堂小实例——设置阴影DropShadow 18110.3.5 课堂小实例——对象的翻转flipH、flipV 18210.3.6 课堂小实例——发光效果glow 18210.3.7 课堂小实例——灰度处理gray 18310.3.8 课堂小实例——反相invert 18410.3.9 课堂小实例——X光片效果xray 18410.3.10 课堂小实例——波形滤镜wave 18410.4 实战应用——CSS字体样式综合演练 18510.5 课后练习 18710.6 本课小结 188第11课 用CSS设计图片和背景11.1 设置网页的背景 19011.1.1 课堂小实例——背景颜色 19011.1.2 课堂小实例——背景图片 19011.2 设置背景图片的样式 19111.2.1 课堂小实例——背景图片重复 19111.2.2 课堂小实例——背景图片附件 19211.2.3 课堂小实例——背景图片定位 19311.3 设置网页图片的样式 19511.3.1 课堂小实例——设置图片边框 19511.3.2 课堂小实例——图文混合排版 19711.4 实战应用 19811.4.1 实战1——给图片添加边框 19811.4.2 实战2——图文绕排效果 19911.5 课后练习 20111.6 本课小结 202第12课 用CSS制作实用的菜单和网站导航12.1 列表的使用 20412.2 列表样式控制 20412.2.1 课堂小实例——ul无序列表 20412.2.2 课堂小实例——ol有序列表 20512.2.3 课堂小实例——dl定义列表 20712.2.4 更改列表项目样式 20812.3 横排导航 20912.3.1 课堂小实例——文本导航 20912.3.2 课堂小实例——标签式导航 21112.4 课堂小实例——竖排导航 21312.5 实战应用 21412.5.1 实战1——实现背景变换的导航菜单 21412.5.2 实战2——利用CSS制作横向导航 21512.5.3 实战3——用背景图片实现CSS柱状图表 21612.5.4 实战4——树形导航菜单 21712.6 课后练习 22012.7 本课小结 220第13课 CSS盒子模型与定位13.1 “盒子”与“模型”的概念 22213.2 border 22213.2.1 课堂小实例——边框样式（border-style） 22313.2.2 属性值的简写形式 22413.2.3 课堂小实例——边框与背景 22513.3 课堂小实例——设置内边距(Padding） 22613.4 课堂小实例——设置外边距（margin） 22713.5 盒子的定位 22813.5.1 静态定位（static） 22913.5.2 课堂小实例——相对定位（relative） 22913.5.3 课堂小实例——绝对定位（absolute） 23013.5.4 课堂小实例——固定定位（fixed） 23213.6 盒子的浮动 23313.6.1 准备代码 23313.6.2 案例——设置第1个浮动的div 23413.7 课后练习 23613.8 本课小结 236第14课 CSS DIV布局方法14.1 CSS布局模型 23814.1.1 关于CSS布局 23814.1.2 流动布局模型 23814.1.3 浮动布局模型 24014.1.4 层布局模型 24214.1.5 高度自适应 24414.2 CSS布局理念 24514.2.1 将页面用div分块 24514.2.2 设计各块的位置 24614.2.3 用CSS定位 24614.3 常见的布局类 24714.3.1 课堂小实例——一列固定宽度 24714.3.2 课堂小实例——一列自适应 24814.3.3 课堂小实例——两列固定宽度 24914.3.4 课堂小实例——两列宽度自适应 25014.3.5 课堂小实例——两列右列宽度自适应 25114.3.6 课堂小实例——三列浮动中间宽度自适应 25214.3.7 课堂小实例——三行二列居中高度自适应布局 25314.4 课后练习 25514.5 本课小结 255第3篇 综合案例篇第15课 设计制作企业网站15.1 企业
网站设计概述 25715.1.1 企业网站分类 25715.1.2 企业网站主要功能 25815.1.3 页面配色与风格设计 25915.1.4 排版构架 26015.2 各部分设计 26115.2.1 页面的通用规则 26115.2.2 制作网站导航部分 26215.2.3 制作header右侧部分 26515.2.4 制作欢迎部分 27215.2.5 制作景点新闻部分 27515.2.6 制作景点介绍部分 27915.2.7 制作景点展示部分 28215.2.8 制作底部版权部分 288附录A CSS属性一览表附录B HTML常用标签
粤公网安备44010602001432号