HTML5和CSS3技术是网页设计的精髓,《HTML5+CSS3网页设计案例教程》以应用实例和综合实战案例的形式,全面涵盖网页设计的基础知识、HTML5和CSS3技术、DIV+CSS布局以及网页制作工具。《HTML5+CSS3网页设计案例教程》包含数百个知识点示例、18个章节综合案例、20个上机案例以及3个综合实战案例,讲解过程由浅入深、循序渐进,力求通过实例操作让读者快速掌握网页设计的方法和技巧。《HTML5+CSS3网页设计案例教程》适合作为大中专院校及培训学校的教材,也可以供网页设计工作人员及爱好者阅读参考。
第1章 网页设计基础知识
1.1 网页相关知识简介
1.1.1 互联网、因特网、万维网
1.1.2 网站、网页和主页
1.1.3 浏览器
1.1.4 统一资源定位器
1.2 网页的基本元素
1.2.1 网页的组成元素
1.2.2 网页的构成要素
1.3 网站建设流程
1.3.1 网站需求分析
1.3.2 网站规划
1.3.3 创建本地站点
1.3.4 组织站点结构 前言
第1章 网页设计基础知识
1.1 网页相关知识简介
1.1.1 互联网、因特网、万维网
1.1.2 网站、网页和主页
1.1.3 浏览器
1.1.4 统一资源定位器
1.2 网页的基本元素
1.2.1 网页的组成元素
1.2.2 网页的构成要素
1.3 网站建设流程
1.3.1 网站需求分析
1.3.2 网站规划
1.3.3 创建本地站点
1.3.4 组织站点结构
1.3.5 设计和制作各级页面
1.3.6 申请空间和域名
1.3.7 测试和发布网站
1.3.8 网站的推广与维护
1.4 网页的版式布局
1.4.1 网页布局原则
1.4.2 常见的版式布局形式
1.5 网页色彩搭配
1.6 网页设计的原则和成功要素
1.7 认识HTML和CSS
习题
第2章 HTML基础
2.1 认识HTML
2.2 HTML文档的基本结构
2.3 HTML文件的编写和查看
2.3.1 HTML文件的编写和查看
2.3.2 HTML文件的命名
2.4 HTML基本语法
2.4.1 HTML标记
2.4.2 HTML属性
2.4.3 全局属性
2.5 HTML文件头部内容
2.5.1 设置页面标题
<br>2.5.2 定义元数据<meta><br>2.5.3 常用元数据<br>2.6 HTML文件主体内容<body><br>2.7 综合案例——最基本的HTML5网页<br>习题<br>第3章 文字与段落<br>3.1 编辑内容<br>3.1.1 添加普通文字<br>3.1.2 添加特殊符号<br>3.1.3 添加注释<br>3.2 文字排版<br>3.2.1 控制换行<br><br>3.2.2 预先格式化<br>3.2.3 段落<p><br>3.2.4 加入水平线<hr><br>3.2.5 标题文字<h1>-<h6><br>3.3 强调文本<br>3.3.1 设置粗体和斜体<b>/<i><br>3.3.2 标记文本改变<ins>/<del><br>3.3.3 小型文本<small><br>3.4 语义化、结构化的文本<br>3.4.1 文字上下标<sup>/<sub><br>3.4.2 注音显示<ruby>/<rt>/<rp><br>3.4.3 标注<cite><br>3.4.4 定义日期时间<time><br>3.4.5 其他语义化、结构化文本<br>3.5 列表<br>3.5.1 无序列表<ul><br>3.5.2 有序列表<ol><br>3.5.3 定义列表<dl>/<dt>/<dd><br>3.5.4 嵌套列表<br>3.6 综合实例——简单文字网页<br>习题<br>第4章 网页图像和多媒体元素<br>4.1 图像、视频和音频的格式<br>4.1.1 网页图像的格式<br>4.1.2 视频格式<br>4.1.3 音频格式<br>4.2 在网页中加入图像<img><br>4.2.1 图像资源属性——src属性<br>4.2.2 图像替代文本——alt属性<br>4.2.3 图像的宽高——width和height属性<br>4.3 在网页中加入视频<video><br>4.3.1 视频资源属性——src属性<br>4.3.2 视频播放控件属性——controls属性<br>4.3.3 视频准备播放控件——preload<br>4.3.4 <video>的其他属性<br>4.3.5 <video>与<source>的配合使用<br>4.4 在网页中加入音频<br>4.5 插入多媒体文件<embed><br>4.5.1 插入Flash动画<br>4.5.2 插入视频<br>4.5.3 插入音频<br>4.6 链入对象<object><br>4.7 定义媒介分组和标题<figure>/<figcaption><br>4.8 综合实例——多媒体页面的设计<br>习题<br>第5章 超链接<br>5.1 超链接概述<br>5.2 超链接的路径<br>5.2.1 绝对路径<br>5.2.2 相对路径<br>5.2.3 根路径<br>5.3 超链接的建立<br>5.3.1 插入外部链接<br>5.3.2 插入内部链接<br>5.3.3 以图像为源点的链接<br>5.3.4 链接打开目标target属性<br>5.3.5 链接的其他属性<br>5.3.6 链接的目标类型<br>5.3.7 Email链接<br>5.4 锚记(书签)链接<br>5.5 设置图像映射<br>5.5.1 了解热区和图像映射<br>5.5.2 创建图像映射<map>/<br>5.6 浮动窗口及其链接<br>5.6.1 浮动窗口<br>5.6.2 链接浮动窗口<br>5.7 定义基准网址<base><br>5.8 综合实例——设置超链接<br>习题<br>第6章 表格的应用<br>6.1 表格概述<br>6.2 创建表格<br>6.2.1 表格基本结构<table>/<tr>/<th>/<td><br>6.2.2 表格边框显示——border属性<br>6.2.3 <th>标记的使用<br>6.2.4 表格标题<caption><br>6.3 合并单元格<br>6.3.1 设置跨列——colspan<br>6.3.2 设置跨行——rowspan<br>6.4 表格嵌套<br>6.5 表格的按行分组显示<thead>/<tbody>/<tfoot><br>6.6 综合实例——表格应用<br>6.6.1 表格显示数据<br>6.6.2 使用表格布局<br>习题<br>第7章 表单<br>7.1 表单概述<br>7.2 建立表单<form><br>7.3 表单控件<br>7.3.1 文本框和密码框<br>7.3.2 提交按钮、重置按钮和普通按钮<br>7.3.3 单选按钮<br>7.3.4 复选框<br>7.3.5 文件域<br>7.3.6 图像域<br>7.3.7 多行文字框<br>7.3.8 列表<br>7.4 表单高级元素使用<br>7.4.1 url属性<br>7.4.2 email属性<br>7.4.3 date和Times<br>7.4.4 number属性<br>7.4.5 range属性<br>7.4.6 color属性<br>7.4.7 fieldset控件组<br>7.4.8 其他类型的输入表单控件<br>7.5 通用的表单属性<br>7.5.1 表单重写属性<br>7.5.2 form属性<br>7.5.3 autofocus属性<br>7.5.4 multiple属性<br>7.5.5 placeholder属性<br>7.5.6 required属性<br>7.5.7 pattern属性<br>7.6 综合实例——表单设计<br>习题<br>第8章 CSS语法基础<br>8.1 CSS介绍<br>8.1.1 CSS概述<br>8.1.2 CSS3<br>8.2 CSS的基本语法<br>8.3 在HTML文档中使用CSS的方法<br>8.3.1 行内样式<br>8.3.2 内嵌样式<br>8.3.3 链接外部样式<br>8.3.4 导入外部样式<br>8.4 CSS元素选择符<br>8.4.1 标记选择符<br>8.4.2 通用选择符<br>8.4.3 类选择符<br>8.4.4 id选择符<br>8.5 其他CSS选择符<br>8.5.1 伪类选择符<br>8.5.2 伪对象选择符<br>8.5.3 组合选择符<br>8.5.4 关系选择符<br>8.5.5 属性选择符<br>8.6 综合案例——CSS的简单应用<br>习题<br>第9章 CSS字体与段落<br>9.1 颜色color<br>9.2 字体属性<br>9.2.1 设置字体font-family<br>9.2.2 设置字号font-size<br>9.2.3 设置字体风格font-style<br>9.2.4 设置字体加粗font-weight<br>9.2.5 设置小型大写字母font-variant<br>9.2.6 字体复合属性font<br>9.3 文本高级样式<br>9.3.1 行高line-height<br>9.3.2 文本缩进text-indent<br>9.3.3 水平对齐方式text-align<br>9.3.4 垂直对齐方式vertical-align<br>9.3.5 大小写text-transform<br>9.3.6 单词间距word-spacing<br>9.3.7 字符间隔letter-spacing<br>9.3.8 文本修饰text-decoration<br>9.3.9 文本阴影text-shadow<br>9.4 综合实例——简单图文混排网页<br>习题<br>第10章 CSS盒子<br>10.1 基本的盒子BOX概念<br>10.1.1 盒子的基本形式<br>10.1.2 盒子大小的计算width/height<br>10.1.3 改变盒子大小的计算方式box-sizing<br>10.2 基本边框属性<br>10.2.1 边框样式<br>10.2.2 边框线宽<br>10.2.3 边框颜色<br>10.2.4 边框复合属性<br>10.3 补白<br>10.3.1 内补白<br>10.3.2 外补白<br>10.4 其他边框属性<br>10.4.1 圆角边框<br>10.4.2 图像边框<br>10.4.3 盒子阴影box-shadow<br>10.4.4 BOX线条外廓<br>10.5 综合案例——简单地产网页<br>习题<br>第11章 CSS颜色和背景<br>11.1 背景颜色<br>11.1.1 网页背景颜色background-color<br>11.1.2 用背景色给页面分块<br>11.2 背景图像<br>11.2.1 页面背景图像background-image<br>11.2.2 背景图像重复background-repeat<br>11.2.3 背景图像滚动background-attachment<br>11.2.4 背景图像位置background-position<br>11.2.5 背景显示区域background-origin<br>11.2.6 背景图像大小background-size<br>11.2.7 背景图像裁剪区域background-clip<br>11.2.8 背景复合属性background<br>11.3 定义透明度<br>11.4 综合实例——设置背景<br>习题<br>第12章 CSS美化其他页面元素<br>12.1 超链接特效<br>12.1.1 超链接样式变换<br>12.1.2 按钮式超链接<br>12.2 鼠标特效<br>12.2.1 鼠标指针形状<br>12.2.2 鼠标变换的超链接<br>12.3 项目列表<br>12.3.1 列表符号list-style-type<br>12.3.2 图片符号list-style-image<br>12.3.3 列表位置list-style-position<br>12.3.4 列表综合设置list-style<br>12.3.5 使用列表制作菜单<br>12.3.6 下拉菜单<br>12.4 综合实例——Tab菜单<br>习题<br>第13章 用CSS美化表格与表单<br>13.1 表格的基本样式<br>13.1.1 表格边框样式<br>13.1.2 表格颜色<br>13.1.3 盒子阴影<br>13.2 <col>和<colgroup><br>13.2.1 <col>标记<br>13.2.2 <colgroup>标记<br>13.2.3 <colgroup>分组<br>13.2.4 <col>和<colgroup>组合应用<br>13.3 表格综合实例<br>13.4 CSS美化表单<br>13.4.1 美化表单元素边框<br>13.4.2 美化表单元素颜色<br>13.4.3 美化表单元素背景图像<br>13.4.4 按钮样式<br>13.5 表格表单综合实例——调查问卷<br>13.5.1 页面布局设计<br>13.5.2 标题栏的设计<br>13.5.3 题目区的设计<br>第14章 CSS定位、布局与分栏<br>14.1 理解CSS定位与div布局<br>14.1.1 <br>14.1.2 <br>14.2 CSS元素的定位<br>14.2.1 定位方式——position<br>14.2.2 设置位置——top、bottom、right、left<br>14.2.3 堆叠次序——z-index<br>14.3 CSS布局属性<br>14.3.1 可见性——visibility<br>14.3.2 剪裁——clip<br>14.3.3 溢出——overflow<br>14.3.4 浮动——float<br>14.3.5 清除——clear<br>14.4 CSS分栏<br>14.4.1 列——columns<br>14.4.2 平衡列——column-fill<br>14.4.3 列间距——column-gap<br>14.4.4 列边框样式——column-rule<br>14.4.5 跨列样式——column-span<br>14.5 综合案例——页面分块布局<br>习题<br>第15章 DIV+CSS布局<br>15.1 CSS排版概念<br>15.1.1 将页面用div分块<br>15.1.2 设计各分块位置<br>15.1.3 设计各分块细节<br>15.2 页面布局方式<br>15.2.1 上中下结构布局<br>15.2.2 左右结构布局<br>15.2.3 “国”字形结构<br>15.2.4 隐藏布局<br>15.3 各种布局版式<br>15.3.1 骨骼型版式<br>15.3.2 对称型版式<br>15.3.3 满版型版式<br>15.3.4 其他版式<br>15.4 综合案例——DIV+CSS布局综合应用<br>15.4.1 首页设计<br>15.4.2 详细页面设计<br>习题<br>第16章 网页编辑工具Dreamweaver<br>16.1 Dreamweaver工具介绍<br>16.1.1 Dreamweaver软件概述<br>16.1.2 DreamweaverCS5.5软件介绍<br>16.1.3 Dreamweaver的工作流程<br>16.2 使用Dreamweaver设计网页<br>16.2.1 创建站点和组织站点结构<br>16.2.2 设计并创建网页<br>16.3 使用Dreamweaver设定CSS样式<br>16.3.1 CSS样式在Dreamweaver中设定的基础知识<br>16.3.2 CSS样式的创建和应用案例<br>16.4 使用Dreamweaver编码<br>16.4.1 使用Dreamweaver对网页编码的常识<br>16.4.2 使用Dreamweaver编码的编辑思路<br>16.4.3 使用Dreamweaver编码的案例<br>16.5 综合实例——使用Dreamweaver制作网页<br>16.5.1 规划和设置站点<br>16.5.2 设计网页布局<br>16.5.3 添加页面内容<br>16.5.4 通过手动编码创建页面<br>16.5.5 测试和发布<br>习题<br>第17章 综合案例——宝贝花园<br>17.1 网页布局概述<br>17.2 首页的设计<br>17.3 主标题区<br>17.3.1 网页首部<br>17.3.2 标题新闻区<br>17.4 主内容区<br>17.4.1 滚动字幕区<br>17.4.2 主内容区<br>17.5 页尾区<br>17.6 内容页的设计<br>17.7 联系页面的设计<br>17.7.1 页面布局<br>17.7.2 左侧栏<br>17.7.3 右侧栏<br>第18章 综合案例——购物网站<br>18.1 首页设计<br>18.1.1 首页页面布局<br>18.1.2 首页头部设计<br>18.1.3 主体部分设计<br>18.1.4 脚注部分设计<br>18.2 内容页设计<br>18.2.1 商品分类信息页<br>18.2.2 单类商品信息页<br>第19章 综合案例——中秋节网站<br>19.1 节日类网站设计分析<br>19.2 实例制作——中秋节网站设计<br>19.2.1 中秋节网站策划<br>19.2.2 主页和内页效果<br>19.2.3 网站主页的设计<br>19.2.4 网站内页的设计<br>
</div>
<div id="tab_mo_3" style="display:none;line-height:22px;height:auto!important;height:150px;min-height:150px;">
前言<br>第1章 网页设计基础知识<br>1.1 网页相关知识简介<br>1.1.1 互联网、因特网、万维网<br>1.1.2 网站、网页和主页<br>1.1.3 浏览器<br>1.1.4 统一资源定位器<br>1.2 网页的基本元素<br>1.2.1 网页的组成元素<br>1.2.2 网页的构成要素<br>1.3 网站建设流程<br>1.3.1 网站需求分析<br>1.3.2 网站规划<br>1.3.3 创建本地站点<br>1.3.4 组织站点结构 前言<br>第1章 网页设计基础知识<br>1.1 网页相关知识简介<br>1.1.1 互联网、因特网、万维网<br>1.1.2 网站、网页和主页<br>1.1.3 浏览器<br>1.1.4 统一资源定位器<br>1.2 网页的基本元素<br>1.2.1 网页的组成元素<br>1.2.2 网页的构成要素<br>1.3 网站建设流程<br>1.3.1 网站需求分析<br>1.3.2 网站规划<br>1.3.3 创建本地站点<br>1.3.4 组织站点结构<br>1.3.5 设计和制作各级页面<br>1.3.6 申请空间和域名<br>1.3.7 测试和发布网站<br>1.3.8 网站的推广与维护<br>1.4 网页的版式布局<br>1.4.1 网页布局原则<br>1.4.2 常见的版式布局形式<br>1.5 网页色彩搭配<br>1.6 网页设计的原则和成功要素<br>1.7 认识HTML和CSS<br>习题<br>第2章 HTML基础<br>2.1 认识HTML<br>2.2 HTML文档的基本结构<br>2.3 HTML文件的编写和查看<br>2.3.1 HTML文件的编写和查看<br>2.3.2 HTML文件的命名<br>2.4 HTML基本语法<br>2.4.1 HTML标记<br>2.4.2 HTML属性<br>2.4.3 全局属性<br>2.5 HTML文件头部内容<head><br>2.5.1 设置页面标题<title><br>2.5.2 定义元数据<meta><br>2.5.3 常用元数据<br>2.6 HTML文件主体内容<body><br>2.7 综合案例——最基本的HTML5网页<br>习题<br>第3章 文字与段落<br>3.1 编辑内容<br>3.1.1 添加普通文字<br>3.1.2 添加特殊符号<br>3.1.3 添加注释<br>3.2 文字排版<br>3.2.1 控制换行<br><br>3.2.2 预先格式化<br>3.2.3 段落<p><br>3.2.4 加入水平线<hr><br>3.2.5 标题文字<h1>-<h6><br>3.3 强调文本<br>3.3.1 设置粗体和斜体<b>/<i><br>3.3.2 标记文本改变<ins>/<del><br>3.3.3 小型文本<small><br>3.4 语义化、结构化的文本<br>3.4.1 文字上下标<sup>/<sub><br>3.4.2 注音显示<ruby>/<rt>/<rp><br>3.4.3 标注<cite><br>3.4.4 定义日期时间<time><br>3.4.5 其他语义化、结构化文本<br>3.5 列表<br>3.5.1 无序列表<ul><br>3.5.2 有序列表<ol><br>3.5.3 定义列表<dl>/<dt>/<dd><br>3.5.4 嵌套列表<br>3.6 综合实例——简单文字网页<br>习题<br>第4章 网页图像和多媒体元素<br>4.1 图像、视频和音频的格式<br>4.1.1 网页图像的格式<br>4.1.2 视频格式<br>4.1.3 音频格式<br>4.2 在网页中加入图像<img><br>4.2.1 图像资源属性——src属性<br>4.2.2 图像替代文本——alt属性<br>4.2.3 图像的宽高——width和height属性<br>4.3 在网页中加入视频<video><br>4.3.1 视频资源属性——src属性<br>4.3.2 视频播放控件属性——controls属性<br>4.3.3 视频准备播放控件——preload<br>4.3.4 <video>的其他属性<br>4.3.5 <video>与<source>的配合使用<br>4.4 在网页中加入音频<br>4.5 插入多媒体文件<embed><br>4.5.1 插入Flash动画<br>4.5.2 插入视频<br>4.5.3 插入音频<br>4.6 链入对象<object><br>4.7 定义媒介分组和标题<figure>/<figcaption><br>4.8 综合实例——多媒体页面的设计<br>习题<br>第5章 超链接<br>5.1 超链接概述<br>5.2 超链接的路径<br>5.2.1 绝对路径<br>5.2.2 相对路径<br>5.2.3 根路径<br>5.3 超链接的建立<br>5.3.1 插入外部链接<br>5.3.2 插入内部链接<br>5.3.3 以图像为源点的链接<br>5.3.4 链接打开目标target属性<br>5.3.5 链接的其他属性<br>5.3.6 链接的目标类型<br>5.3.7 Email链接<br>5.4 锚记(书签)链接<br>5.5 设置图像映射<br>5.5.1 了解热区和图像映射<br>5.5.2 创建图像映射<map>/<br>5.6 浮动窗口及其链接<br>5.6.1 浮动窗口<br>5.6.2 链接浮动窗口<br>5.7 定义基准网址<base><br>5.8 综合实例——设置超链接<br>习题<br>第6章 表格的应用<br>6.1 表格概述<br>6.2 创建表格<br>6.2.1 表格基本结构<table>/<tr>/<th>/<td><br>6.2.2 表格边框显示——border属性<br>6.2.3 <th>标记的使用<br>6.2.4 表格标题<caption><br>6.3 合并单元格<br>6.3.1 设置跨列——colspan<br>6.3.2 设置跨行——rowspan<br>6.4 表格嵌套<br>6.5 表格的按行分组显示<thead>/<tbody>/<tfoot><br>6.6 综合实例——表格应用<br>6.6.1 表格显示数据<br>6.6.2 使用表格布局<br>习题<br>第7章 表单<br>7.1 表单概述<br>7.2 建立表单<form><br>7.3 表单控件<br>7.3.1 文本框和密码框<br>7.3.2 提交按钮、重置按钮和普通按钮<br>7.3.3 单选按钮<br>7.3.4 复选框<br>7.3.5 文件域<br>7.3.6 图像域<br>7.3.7 多行文字框<br>7.3.8 列表<br>7.4 表单高级元素使用<br>7.4.1 url属性<br>7.4.2 email属性<br>7.4.3 date和Times<br>7.4.4 number属性<br>7.4.5 range属性<br>7.4.6 color属性<br>7.4.7 fieldset控件组<br>7.4.8 其他类型的输入表单控件<br>7.5 通用的表单属性<br>7.5.1 表单重写属性<br>7.5.2 form属性<br>7.5.3 autofocus属性<br>7.5.4 multiple属性<br>7.5.5 placeholder属性<br>7.5.6 required属性<br>7.5.7 pattern属性<br>7.6 综合实例——表单设计<br>习题<br>第8章 CSS语法基础<br>8.1 CSS介绍<br>8.1.1 CSS概述<br>8.1.2 CSS3<br>8.2 CSS的基本语法<br>8.3 在HTML文档中使用CSS的方法<br>8.3.1 行内样式<br>8.3.2 内嵌样式<br>8.3.3 链接外部样式<br>8.3.4 导入外部样式<br>8.4 CSS元素选择符<br>8.4.1 标记选择符<br>8.4.2 通用选择符<br>8.4.3 类选择符<br>8.4.4 id选择符<br>8.5 其他CSS选择符<br>8.5.1 伪类选择符<br>8.5.2 伪对象选择符<br>8.5.3 组合选择符<br>8.5.4 关系选择符<br>8.5.5 属性选择符<br>8.6 综合案例——CSS的简单应用<br>习题<br>第9章 CSS字体与段落<br>9.1 颜色color<br>9.2 字体属性<br>9.2.1 设置字体font-family<br>9.2.2 设置字号font-size<br>9.2.3 设置字体风格font-style<br>9.2.4 设置字体加粗font-weight<br>9.2.5 设置小型大写字母font-variant<br>9.2.6 字体复合属性font<br>9.3 文本高级样式<br>9.3.1 行高line-height<br>9.3.2 文本缩进text-indent<br>9.3.3 水平对齐方式text-align<br>9.3.4 垂直对齐方式vertical-align<br>9.3.5 大小写text-transform<br>9.3.6 单词间距word-spacing<br>9.3.7 字符间隔letter-spacing<br>9.3.8 文本修饰text-decoration<br>9.3.9 文本阴影text-shadow<br>9.4 综合实例——简单图文混排网页<br>习题<br>第10章 CSS盒子<br>10.1 基本的盒子BOX概念<br>10.1.1 盒子的基本形式<br>10.1.2 盒子大小的计算width/height<br>10.1.3 改变盒子大小的计算方式box-sizing<br>10.2 基本边框属性<br>10.2.1 边框样式<br>10.2.2 边框线宽<br>10.2.3 边框颜色<br>10.2.4 边框复合属性<br>10.3 补白<br>10.3.1 内补白<br>10.3.2 外补白<br>10.4 其他边框属性<br>10.4.1 圆角边框<br>10.4.2 图像边框<br>10.4.3 盒子阴影box-shadow<br>10.4.4 BOX线条外廓<br>10.5 综合案例——简单地产网页<br>习题<br>第11章 CSS颜色和背景<br>11.1 背景颜色<br>11.1.1 网页背景颜色background-color<br>11.1.2 用背景色给页面分块<br>11.2 背景图像<br>11.2.1 页面背景图像background-image<br>11.2.2 背景图像重复background-repeat<br>11.2.3 背景图像滚动background-attachment<br>11.2.4 背景图像位置background-position<br>11.2.5 背景显示区域background-origin<br>11.2.6 背景图像大小background-size<br>11.2.7 背景图像裁剪区域background-clip<br>11.2.8 背景复合属性background<br>11.3 定义透明度<br>11.4 综合实例——设置背景<br>习题<br>第12章 CSS美化其他页面元素<br>12.1 超链接特效<br>12.1.1 超链接样式变换<br>12.1.2 按钮式超链接<br>12.2 鼠标特效<br>12.2.1 鼠标指针形状<br>12.2.2 鼠标变换的超链接<br>12.3 项目列表<br>12.3.1 列表符号list-style-type<br>12.3.2 图片符号list-style-image<br>12.3.3 列表位置list-style-position<br>12.3.4 列表综合设置list-style<br>12.3.5 使用列表制作菜单<br>12.3.6 下拉菜单<br>12.4 综合实例——Tab菜单<br>习题<br>第13章 用CSS美化表格与表单<br>13.1 表格的基本样式<br>13.1.1 表格边框样式<br>13.1.2 表格颜色<br>13.1.3 盒子阴影<br>13.2 <col>和<colgroup><br>13.2.1 <col>标记<br>13.2.2 <colgroup>标记<br>13.2.3 <colgroup>分组<br>13.2.4 <col>和<colgroup>组合应用<br>13.3 表格综合实例<br>13.4 CSS美化表单<br>13.4.1 美化表单元素边框<br>13.4.2 美化表单元素颜色<br>13.4.3 美化表单元素背景图像<br>13.4.4 按钮样式<br>13.5 表格表单综合实例——调查问卷<br>13.5.1 页面布局设计<br>13.5.2 标题栏的设计<br>13.5.3 题目区的设计<br>第14章 CSS定位、布局与分栏<br>14.1 理解CSS定位与div布局<br>14.1.1 <br>14.1.2 <br>14.2 CSS元素的定位<br>14.2.1 定位方式——position<br>14.2.2 设置位置——top、bottom、right、left<br>14.2.3 堆叠次序——z-index<br>14.3 CSS布局属性<br>14.3.1 可见性——visibility<br>14.3.2 剪裁——clip<br>14.3.3 溢出——overflow<br>14.3.4 浮动——float<br>14.3.5 清除——clear<br>14.4 CSS分栏<br>14.4.1 列——columns<br>14.4.2 平衡列——column-fill<br>14.4.3 列间距——column-gap<br>14.4.4 列边框样式——column-rule<br>14.4.5 跨列样式——column-span<br>14.5 综合案例——页面分块布局<br>习题<br>第15章 DIV+CSS布局<br>15.1 CSS排版概念<br>15.1.1 将页面用div分块<br>15.1.2 设计各分块位置<br>15.1.3 设计各分块细节<br>15.2 页面布局方式<br>15.2.1 上中下结构布局<br>15.2.2 左右结构布局<br>15.2.3 “国”字形结构<br>15.2.4 隐藏布局<br>15.3 各种布局版式<br>15.3.1 骨骼型版式<br>15.3.2 对称型版式<br>15.3.3 满版型版式<br>15.3.4 其他版式<br>15.4 综合案例——DIV+CSS布局综合应用<br>15.4.1 首页设计<br>15.4.2 详细页面设计<br>习题<br>第16章 网页编辑工具Dreamweaver<br>16.1 Dreamweaver工具介绍<br>16.1.1 Dreamweaver软件概述<br>16.1.2 DreamweaverCS5.5软件介绍<br>16.1.3 Dreamweaver的工作流程<br>16.2 使用Dreamweaver设计网页<br>16.2.1 创建站点和组织站点结构<br>16.2.2 设计并创建网页<br>16.3 使用Dreamweaver设定CSS样式<br>16.3.1 CSS样式在Dreamweaver中设定的基础知识<br>16.3.2 CSS样式的创建和应用案例<br>16.4 使用Dreamweaver编码<br>16.4.1 使用Dreamweaver对网页编码的常识<br>16.4.2 使用Dreamweaver编码的编辑思路<br>16.4.3 使用Dreamweaver编码的案例<br>16.5 综合实例——使用Dreamweaver制作网页<br>16.5.1 规划和设置站点<br>16.5.2 设计网页布局<br>16.5.3 添加页面内容<br>16.5.4 通过手动编码创建页面<br>16.5.5 测试和发布<br>习题<br>第17章 综合案例——宝贝花园<br>17.1 网页布局概述<br>17.2 首页的设计<br>17.3 主标题区<br>17.3.1 网页首部<br>17.3.2 标题新闻区<br>17.4 主内容区<br>17.4.1 滚动字幕区<br>17.4.2 主内容区<br>17.5 页尾区<br>17.6 内容页的设计<br>17.7 联系页面的设计<br>17.7.1 页面布局<br>17.7.2 左侧栏<br>17.7.3 右侧栏<br>第18章 综合案例——购物网站<br>18.1 首页设计<br>18.1.1 首页页面布局<br>18.1.2 首页头部设计<br>18.1.3 主体部分设计<br>18.1.4 脚注部分设计<br>18.2 内容页设计<br>18.2.1 商品分类信息页<br>18.2.2 单类商品信息页<br>第19章 综合案例——中秋节网站<br>19.1 节日类网站设计分析<br>19.2 实例制作——中秋节网站设计<br>19.2.1 中秋节网站策划<br>19.2.2 主页和内页效果<br>19.2.3 网站主页的设计<br>19.2.4 网站内页的设计<br>
</div>
</div>
<div class="clear"></div>
<script type="text/javascript">
function tab(a,b,c)
{
for(i=1;i<=b;i++){
if(c==i)
{
// 判断选择模块
document.getElementById(a+"_mo_"+i).style.display = "block"; // 显示模块内容
document.getElementById(a+"_to_"+i).className = "no"; // 改变菜单为选中样式
}
else{
// 没有选择的模块
document.getElementById(a+"_mo_"+i).style.display = "none"; // 隐藏没有选择的模块
document.getElementById(a+"_to_"+i).className = "q"; // 清空没有选择的菜单样式
}
}
}
</script>
<div class="b-comment">
<div class="mt">
<span> 你还可能感兴趣</span>
</div>
</div>
<div class="d-comment">
<ul>
<li><a href="bookshow.asp?id=138731" target="_blank"><img src="http://pic.book1993.com/Pic/uploadfile/m_images/2013803046514206_1.jpg" alt="Dreamweaver CS6网页制作(配光盘)(一学就会魔法书(第3版))" name="Pic" onerror="showImgDelay(this,'http://pic.book1993.com/Pichttp://pic.book1993.com/Pic/uploadfile/m_images/2013803046514206_1.jpg',2);" width="148" height="148"></a><br><a href="bookshow.asp?id=138731" title="Dreamweaver CS6网页制作(配光盘)(一学就会魔法书(第3版))" target="_blank">Dreamweaver CS6网页制作(配光盘)(一学就会魔法书(第3版))</a></li><li><a href="bookshow.asp?id=182497" target="_blank"><img src="http://pic.book1993.com/Pic/uploadfile/202408/9787302667995.jpg" alt="Vue.js 3.x+Element Plus从入门到项目实践" name="Pic" onerror="showImgDelay(this,'http://pic.book1993.com/Pichttp://pic.book1993.com/Pic/uploadfile/202408/9787302667995.jpg',2);" width="148" height="148"></a><br><a href="bookshow.asp?id=182497" title="Vue.js 3.x+Element Plus从入门到项目实践" target="_blank">Vue.js 3.x+Element Plus从入门到项目实践</a></li><li><a href="bookshow.asp?id=86904" target="_blank"><img src="http://pic.book1993.com/Pic/uploadfile/202002/2020021911330239239.jpg" alt="ASP.NET 3.5动态网站开发实例与操作" name="Pic" onerror="showImgDelay(this,'http://pic.book1993.com/Pichttp://pic.book1993.com/Pic/uploadfile/202002/2020021911330239239.jpg',2);" width="148" height="148"></a><br><a href="bookshow.asp?id=86904" title="ASP.NET 3.5动态网站开发实例与操作" target="_blank">ASP.NET 3.5动态网站开发实例与操作</a></li><li><a href="bookshow.asp?id=133837" target="_blank"><img src="http://pic.book1993.com/Pic/uploadfile/202006/20200617163394249424.jpg" alt="Vue.js 2.x实践指南" name="Pic" onerror="showImgDelay(this,'http://pic.book1993.com/Pichttp://pic.book1993.com/Pic/uploadfile/202006/20200617163394249424.jpg',2);" width="148" height="148"></a><br><a href="bookshow.asp?id=133837" title="Vue.js 2.x实践指南" target="_blank">Vue.js 2.x实践指南</a></li><li><a href="bookshow.asp?id=83188" target="_blank"><img src="http://pic.book1993.com/Pic/uploadfile/e/renyou/149172.jpg" alt="Dreamweaver+Animate+Photoshop网页制作案例教程(第4版)" name="Pic" onerror="showImgDelay(this,'http://pic.book1993.com/Pichttp://pic.book1993.com/Pic/uploadfile/e/renyou/149172.jpg',2);" width="148" height="148"></a><br><a href="bookshow.asp?id=83188" title="Dreamweaver+Animate+Photoshop网页制作案例教程(第4版)" target="_blank">Dreamweaver+Animate+Photoshop网页制作案例教程(第4版)</a></li>
</ul>
</div>
<div class="b-comment">
<div class="mt">
<span> 我要评论</span>
</div>
</div>
<div class="c-comment">
<form method="post" name="comment" action="/book_comment.asp">
<table border="0" cellspacing="1" cellpadding="3" class="commentlist">
<input name=id type=hidden value="79604">
<input name=title type=hidden value="HTML5+CSS3网页设计案例教程">
<tr>
<th>您的姓名</th>
<td><input type="text" name="name" size="20" maxlength="20" class="form" /> 验证码:<input name="verifycode" type="text" size="7" style=" height:18px;" /> <img src="safecode.asp?" onClick="this.src+=Math.random()" alt="图片看不清?点击重新得到验证码" style="cursor:hand;" height="18" /></td>
</tr>
<tr>
<th>留言内容</th>
<td><textarea name="content" id="content" cols="46" rows="3" class="form-textarea" wrap=physical onKeyDown="checkMaxInput(this.form)" onKeyUp="checkMaxInput(this.form)" style="overflow:auto"></textarea></td>
</tr>
<tr>
<td colspan="2"><input type="submit" value=" 发表评论 " name="cmdok" class="button" /><input type="hidden" name="do" value="save" /></td>
</tr>
</table>
</form>
</div>
<!---div class="b-comment_fenlei">
<ul>
</ul>
</div--->
</div>
</td>
</tr>
</table>
<div id="footer">
<div class="end_list"><a href="aboutus.asp" title="">关于我们</a><a href="Honor.asp" title="">荣誉资质</a><a href="lxwm.asp" target="_blank" title="">联系我们</a></div>
<div class="copyright_n">
Copyright 1993-2020 <a href="http://book.book1993.com">book.book1993.com</a> Inc.All Rights Reserved<br>
公司名称:山东中教产业发展股份有限公司 公司地址:山东省济南市大桥镇128号 联系电话:400-0531-123
<br>版权所有:山东中教产业发展股份有限公司
<script type="text/javascript">
var _bdhmProtocol = (("https:" == document.location.protocol) ? " https://" : " http://");
document.write(unescape("%3Cscript src='" + _bdhmProtocol + "hm.baidu.com/h.js%3F34a0559de8bca702f061988709fd9a88' type='text/javascript'%3E%3C/script%3E"));
</script>
</div>
<div class="ban_img"><img src="images/ban_img.png" width="691" height="55"></div>
</div>
<script src="/images/common.js" language="javascript"></script>
</body>
</html>
</body></html>