HTML+CSS+JavaScript网页制作（Web前端开发）（第3版） “十二五”职业教育国家规划教材 立体化教材 课证融通教材
定 价：65 元
丛书名：“十二五”职业教育国家规划教材
- 作者：刘瑞新 张兵义 朱立 等
- 出版时间：2021/9/1
- ISBN：9787111686064
- 出 版 社：机械工业出版社
- 中图法分类：TP312.8
- 页码：268
- 纸张：
- 版次：
- 开本：16开
本书依据部分“双高”院校的《Web前端技术课程教学标准》，并依据1+X证书《Web前端开发职业技能等级标准（初级）》编写，内容包括HTML5、CSS3、JavaScript、jQuery开发技术基础和典型HTML5网站开发综合案例。本书以模块化的结构来组织章节，以“爱心包装”网站的开发为主线，通过对模块中每个任务相应知识点的讲解，引导读者学习Web前端开发的基本知识，熟悉项目开发、测试的完整流程。
本书适合作为高职高专院校Web前端技术课程、网页设计与制作课程的教材，也可作为1+X证书《Web前端开发职业技能等级标准（初级）》的考试参考用书。
目录
前言
第1章 HTML5概述
1.1 Web简介
1.1.1 WWW和浏览器的基本概念
1.1.2 URL
1.1.3 超文本
1.1.4 超文本标记语言HTML
1.1.5 HTTP
1.2 Web标准
1.2.1 什么是Web标准
1.2.2 理解表现和结构相分离
1.3 HTML简介
1.3.1 Web技术发展历程
1.3.2 HTML5的特性
1.3.3 HTML5元素
1.4 HTML5的基本结构
1.4.1 HTML5语法结构
1.4.2 HTML5编写规范
1.4.3 HTML5文档结构
1.5 创建HTML文件
1.6 支持HTML5的浏览器
习题1
第2章 HTML5基础
2.1 head元素
2.1.1 页面标题标签
<br>2.1.2 元信息标签<meta><br>2.1.3 关联标签<link><br>2.1.4 脚本标签<script><br>2.2 文本元素<br>2.2.1 标题文字标签<h><br>2.2.2 特殊符号<br>2.3 文本层次语义元素<br>2.3.1 时间和日期标签<time><br>2.3.2 标记标签<mark><br>2.3.3 引用标签<cite><br>2.4 基本排版元素<br>2.4.1 段落标签<p><br>2.4.2 换行标签<br><br>2.4.3 预格式化标签<br>2.4.4 缩排标签<blockquote><br>2.4.5 水平线标签<hr/><br>2.4.6 案例—制作爱心包装品牌简介页面<br>2.5 列表元素<br>2.5.1 无序列表<br>2.5.2 有序列表<br>2.5.3 定义列表<br>2.5.4 嵌套列表<br>2.6 图像元素<br>2.6.1 网页图像的常用格式<br>2.6.2 图像标签<img><br>2.6.3 设置网页背景图像<br>2.6.4 图文混排<br>2.6.5 案例—制作爱心包装经营模式图文简介页面<br>2.7 超链接<br>2.7.1 超链接概述<br>2.7.2 超链接的应用<br>2.7.3 案例—制作爱心包装下载专区页面<br>2.8 div元素<br>2.9 span元素<br>2.9.1 基本语法<br>2.9.2 <span>与<div>标签的区别<br>2.9.3 使用<div>和<span>标签布局网页内容<br>习题2<br>第3章 HTML5页面的布局与交互<br>3.1 使用结构标签构建网页布局<br>3.1.1 区段标签<section><br>3.1.2 导航标签<nav><br>3.1.3 页眉标签<header><br>3.1.4 页脚标签<footer><br>3.1.5 独立内容标签<article><br>3.1.6 附属信息标签<aside><br>3.1.7 分组标签<br>3.1.8 案例—制作爱心包装新品发布页面<br>3.2 页面交互元素<br>3.2.1 <details>标签和<summary>标签<br>3.2.2 <progress>标签<br>3.3 表格<br>3.3.1 表格的结构<br>3.3.2 表格的基本语法<br>3.3.3 表格的属性<br>3.3.4 不规范表格<br>3.3.5 表格数据的分组<br>3.3.6 案例—使用表格布局爱心包装产品展示页面<br>3.4 表单<br>3.4.1 表单的基本概念<br>3.4.2 表单标签<br>3.4.3 表单元素<br>3.4.4 案例—制作爱心包装会员注册表单<br>3.4.5 表单分组<br>3.4.6 使用表格布局表单<br>3.4.7 表单的高级用法<br>习题3<br>第4章 CSS3基础<br>4.1 CSS简介<br>4.1.1 什么是CSS<br>4.1.2 CSS的开发环境<br>4.1.3 CSS编写规则<br>4.2 CSS的引用方法<br>4.2.1 定义行内样式<br>4.2.2 定义内部样式表<br>4.2.3 链入外部样式表<br>4.2.4 导入外部样式表<br>4.3 CSS语法基础<br>4.3.1 CSS样式规则<br>4.3.2 基本选择符<br>4.3.3 复合选择符<br>4.3.4 通配符选择符<br>4.3.5 特殊选择符<br>4.4 CSS的属性单位<br>4.4.1 长度单位和百分比单位<br>4.4.2 色彩单位<br>4.5 文档结构<br>4.5.1 文档结构的基本概念<br>4.5.2 继承<br>4.5.3 样式表的层叠、特殊性与重要性<br>4.5.4 元素类型<br>4.5.5 案例—制作爱心包装新闻更新局部页面<br>习题4<br>第5章 CSS盒模型<br>5.1 盒模型概述<br>5.2 盒模型的属性<br>5.2.1 边框<br>5.2.2 外边距<br>5.2.3 内边距<br>5.2.4 案例—盒模型属性之间的关系<br>5.3 盒模型的大小<br>5.3.1 盒模型的宽度与高度<br>5.3.2 设置块级元素与行级元素的宽度和高度<br>5.4 盒子的定位<br>5.4.1 定位属性<br>5.4.2 定位方式<br>5.5 浮动与清除浮动<br>5.5.1 浮动<br>5.5.2 清除浮动<br>5.5.3 案例—爱心包装登录页面的整体布局<br>习题5<br>第6章 使用CSS美化页面<br>6.1 设置字体样式<br>6.1.1 字体类型<br>6.1.2 字体大小<br>6.1.3 字体粗细<br>6.1.4 字体倾斜<br>6.1.5 设置字体样式综合案例<br>6.2 设置文本样式<br>6.2.1 文本水平对齐方式<br>6.2.2 行高<br>6.2.3 文本的修饰<br>6.2.4 段落首行缩进<br>6.2.5 首字下沉<br>6.2.6 文本的截断<br>6.2.7 文本的颜色<br>6.2.8 文本的背景颜色<br>6.2.9 设置文本样式综合案例<br>6.3 设置图像样式<br>6.3.1 图像缩放<br>6.3.2 图像边框<br>6.3.3 图像的不透明度<br>6.3.4 背景图像<br>6.3.5 背景重复<br>6.3.6 背景图像大小<br>6.4 设置表格样式<br>6.4.1 常用的CSS表格属性<br>6.4.2 案例—使用斑马线表格制作包装项目年度排行榜<br>6.5 设置表单样式<br>6.5.1 使用CSS修饰常用的表单元素<br>6.5.2 案例—制作爱心包装用户调查页面<br>6.6 设置超链接样式<br>6.6.1 设置文字超链接的外观<br>6.6.2 设置图文超链接的外观<br>6.7 设置列表<br>6.7.1 表格布局的缺点<br>6.7.2 列表布局的优势<br>6.7.3 CSS列表属性<br>6.7.4 案例—制作爱心包装二维码名片<br>6.8 创建导航菜单<br>6.8.1 纵向导航菜单<br>6.8.2 横向导航菜单<br>习题6<br>第7章 使用CSS布局页面<br>7.1 Div+CSS布局技术概述<br>7.1.1 认识Div+CSS布局<br>7.1.2 正确理解Web标准<br>7.2 Div的嵌套布局<br>7.2.1 将页面用Div分块<br>7.2.2 案例—制作爱心包装活动发布页面<br>7.3 常见的CSS布局样式<br>7.3.1 两列布局样式<br>7.3.2 三列布局样式<br>7.4 综合案例—制作爱心社区页面<br>7.4.1 页面布局规划<br>7.4.2 页面的制作过程<br>习题7<br>第8章 JavaScript语言基础<br>8.1 JavaScript简介<br>8.2 在网页中插入JavaScript的方法<br>8.2.1 在HTML文档中嵌入脚本程序<br>8.2.2 链接脚本文件<br>8.2.3 在HTML标签内添加脚本<br>8.3 JavaScript的基本数据类型和表达式<br>8.3.1 基本数据类型<br>8.3.2 常量<br>8.3.3 变量<br>8.3.4 运算符和表达式<br>8.4 JavaScript的程序结构<br>8.4.1 简单语句<br>8.4.2 程序控制流程<br>8.5 函数<br>8.5.1 函数的定义<br>8.5.2 函数的调用<br>8.5.3 全局变量与局部变量<br>8.6 基于对象的JavaScript语言<br>8.6.1 对象<br>8.6.2 对象的属性<br>8.6.3 对象的事件<br>8.6.4 对象的方法<br>8.7 JavaScript的内置对象<br>8.7.1 数组对象<br>8.7.2 字符串对象<br>8.7.3 日期对象<br>8.8 自定义对象<br>习题8<br>第9章 DOM对象及编程<br>9.1 DOM模型<br>9.2 window对象<br>9.2.1 window对象的属性<br>9.2.2 window对象的方法<br>9.3 document对象<br>9.3.1 document对象的属性<br>9.3.2 document对象的方法<br>9.4 location对象<br>9.4.1 location对象的属性<br>9.4.2 location对象的方法<br>9.5 history对象<br>9.6 form对象<br>9.6.1 form对象的属性<br>9.6.2 form对象的方法<br>9.7 JavaScript的对象事件处理程序<br>9.7.1 对象的事件<br>9.7.2 常用的事件及处理<br>9.7.3 表单对象与交互性<br>9.7.4 案例—使用form对象实现Web页面信息交互<br>习题9<br>第10章 使用JavaScript制作网页特效<br>10.1 文字特效<br>10.1.1 制作颜色变换的欢迎词<br>10.1.2 打字效果<br>10.2 菜单与选项卡特效<br>10.2.1 制作爱心包装导航菜单<br>10.2.2 制作Tab选项卡切换效果<br>10.3 广告特效<br>习题10<br>第11章 HTML5的多媒体播放和绘图<br>11.1 多媒体播放<br>11.1.1 HTML5的多媒体支持<br>11.1.2 音频标签<br>11.1.3 视频标签<br>11.1.4 HTML5多媒体API<br>11.2 Canvas绘图<br>11.2.1 创建canvas元素<br>11.2.2 构建绘图环境<br>11.2.3 通过JavaScript绘制图形<br>习题11<br>第12章 jQuery基础<br>12.1 jQuery概述<br>12.2 编写jQuery程序<br>12.2.1 下载与配置jQuery<br>12.2.2 编写一个简单的jQuery程序<br>12.3 jQuery对象和DOM对象<br>12.3.1 jQuery对象和DOM对象简介<br>12.3.2 jQuery对象和DOM对象的相互转换<br>12.4 jQuery插件<br>12.4.1 下载jQuery插件<br>12.4.2 引用jQuery插件的方法<br>12.5 jQuery选择器<br>12.5.1 jQuery的工厂函数<br>12.5.2 jQuery选择器定义<br>12.6 基础选择器<br>12.6.1 ID选择器<br>12.6.2 元素选择器<br>12.6.3 类名选择器<br>12.6.4 复合选择器<br>12.6.5 通配符选择器<br>12.7 层次选择器<br>12.7.1 ancestor descendant选择器<br>12.7.2 parent>child选择器<br>12.7.3 prev+next选择器<br>12.7.4 prev~siblings选择器<br>12.8 过滤选择器<br>12.8.1 简单过滤器<br>12.8.2 内容过滤器<br>12.8.3 可见性过滤器<br>12.8.4 子元素过滤器<br>12.9 表单选择器<br>习题12<br>第13章 jQuery动画与UI插件<br>13.1 jQuery的动画方法<br>13.2 显示与隐藏效果<br>13.2.1 隐藏元素的方法<br>13.2.2 显示元素的方法<br>13.3 淡入淡出效果<br>13.3.1 淡入效果<br>13.3.2 淡出效果<br>13.3.3 元素的不透明效果<br>13.3.4 交替淡入淡出效果<br>13.4 滑动效果<br>13.4.1 向下展开效果<br>13.4.2 向上收缩效果<br>13.4.3 交替伸缩效果<br>13.5 jQuery UI概述<br>13.5.1 jQuery UI简介<br>13.5.2 jQuery UI的下载<br>13.5.3 jQuery UI的使用<br>13.5.4 jQuery UI的工作原理<br>13.6 jQuery UI的常用插件<br>13.6.1 折叠面板插件<br>13.6.2 日期选择器插件<br>13.6.3 标签页插件<br>习题13<br>第14章 爱心包装网站开发综合案例<br>14.1 网站的开发流程<br>14.2 网站结构<br>14.2.1 创建站点目录<br>14.2.2 网站页面的组成<br>14.3 网站技术分析<br>14.4 制作首页<br>习题14<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=1998565" target="_blank"><img src="/uploadfile/202103/9787111669432.jpg" alt="Java程序性能优化实战" name="Pic" onerror="showImgDelay(this,'/uploadfile/202103/9787111669432.jpg',2);" width="148" height="148"></a><br><a href="bookshow.asp?id=1998565" title="Java程序性能优化实战" target="_blank">Java程序性能优化实战</a></li><li><a href="bookshow.asp?id=2185386" target="_blank"><img src="/uploadfile/202110/9787302571179.jpg" alt=" C语言程序设计教程（第3版）" name="Pic" onerror="showImgDelay(this,'/uploadfile/202110/9787302571179.jpg',2);" width="148" height="148"></a><br><a href="bookshow.asp?id=2185386" title=" C语言程序设计教程（第3版）" target="_blank"> C语言程序设计教程（第3版）</a></li><li><a href="bookshow.asp?id=1853358" target="_blank"><img src="/uploadfile/202004/9787115504104.jpg" alt="Java 开发从入门到精通 第2版" name="Pic" onerror="showImgDelay(this,'/uploadfile/202004/9787115504104.jpg',2);" width="148" height="148"></a><br><a href="bookshow.asp?id=1853358" title="Java 开发从入门到精通 第2版" target="_blank">Java 开发从入门到精通 第2版</a></li><li><a href="bookshow.asp?id=1183677" target="_blank"><img src="/uploadfile/dimages02/9787517054115.jpg" alt=" jQuery实战从入门到精通" name="Pic" onerror="showImgDelay(this,'/uploadfile/dimages02/9787517054115.jpg',2);" width="148" height="148"></a><br><a href="bookshow.asp?id=1183677" title=" jQuery实战从入门到精通" target="_blank"> jQuery实战从入门到精通</a></li><li><a href="bookshow.asp?id=2151242" target="_blank"><img src="/uploadfile/202106/9787111675570.jpg" alt="C++程序设计教程" name="Pic" onerror="showImgDelay(this,'/uploadfile/202106/9787111675570.jpg',2);" width="148" height="148"></a><br><a href="bookshow.asp?id=2151242" title="C++程序设计教程" target="_blank">C++程序设计教程</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="2201063">
<input name=title type=hidden value="HTML+CSS+JavaScript网页制作（Web前端开发）（第3版） “十二五”职业教育国家规划教材 立体化教材 课证融通教材">
<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="/zxbooks.asp" title="">定向推荐书目</a><a href="/cbs_dc.asp" title=""><strong><font color="#f8e81f">采访数据下载(EXCEL格式)</font></strong></a><a href="http://www.gpcffw.com/download.asp" title=""><strong><font color="#f8e81f">采访数据下载(ISO格式)</font></strong></a><a href="/myadmin/login.asp" title="" target="_blank">出版社登录</a><a href="lxwm.asp" target="_blank" title="">联系我们</a></div>
<div class="copyright_n">
Copyright 1993-2024 <a href="http://gs.tsxcfw.com/">gs.tsxcfw.com</a> Inc.All Rights Reserved<br>
公司名称：甘肃纸中城邦书业有限公司 公司地址：兰州市城关区东岗西路455号中兴大厦4楼 联系电话：0931-8518301 8817240 13659321480 13609309480
<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>
</body>
</html>
</body></html> 
书单推荐
