网页设计与制作教程（HTML+CSS+JavaScript）第2版 / “十三五”普通高等教育规划教材
￥55.00定价
作者： 刘瑞新 张兵义 主编
出版时间：2022-09-23
出版社：机械工业出版社
- 机械工业出版社
- 9787111580355
- 2-12
- 60026
- 48239498-8
- 平装
- 16开
- 2022-09-23
- 462
- 304
- 工学
- 计算机科学与技术
- TP393.092
- 数字媒体技术
- 本科
内容简介
《网页设计与制作教程（HTML+CSS+JavaScript）第2版》面向网页制作的读者，采用全新流行的Web标准，以HTML技术为基础，由浅入深、完整详细地介绍了HTML5、CSS3及JavaScript网页制作内容。《网页设计与制作教程（HTML+CSS+JavaScript）第2版》把介绍知识与实例制作融于一体，以光影世界网站（包括主页、栏目页、内容页、后台管理等页面）作为案例讲解，配以家具商城网站的实训练习，两条主线互相结合、相辅相成，自始至终贯穿全书。《网页设计与制作教程（HTML+CSS+JavaScript）第2版》采用案例驱动的教学方法，以案例为引导，结构上采用点面结合，引导读者学习网页制作、设计、规划的基本知识以及项目开发、测试的完整流程。
《网页设计与制作教程（HTML+CSS+JavaScript）第2版》适合作为高等学校、职业院校计算机及相关专业或培训班的网站开发与网页制作教材，也可作为网页制作爱好者与网站开发维护人员的学习参考书。
《网页设计与制作教程（HTML+CSS+JavaScript）第2版》配套授课电子教案，需要的教师可登录www.cmpedu.com免费注册，审核通过后下载，或联系编辑索取（QQ：2399929378，电话：010-88379739）。
《网页设计与制作教程（HTML+CSS+JavaScript）第2版》适合作为高等学校、职业院校计算机及相关专业或培训班的网站开发与网页制作教材，也可作为网页制作爱好者与网站开发维护人员的学习参考书。
《网页设计与制作教程（HTML+CSS+JavaScript）第2版》配套授课电子教案，需要的教师可登录www.cmpedu.com免费注册，审核通过后下载，或联系编辑索取（QQ：2399929378，电话：010-88379739）。
目录
第1章 网页设计与制作基础
1.1 网页与网站的概念
1.2 Web标准
1.2.1 Web标准的概念
1.2.2 建立Web标准的优点
1.2.3 理解表现和结构相分离
1.3 HTML语法基础
1.3.1 HTML简介
1.3.2 HTML语法结构
1.3.3 HTML语法规范
1.3.4 HTML文档结构
1.4 网页结构
1.5 创建HTML文档
1.6 页面摘要信息
1.6.1标签<br/>1.6.2 <meta>标签<br/>1.6.3 案例——制作光影世界页面摘要信息<br/>1.7 注释和特殊符号<br/>1.7.1 注释<br/>1.7.2 特殊符号<br/>1.8 课堂综合实训——制作家具商城页面的版权信息<br/>习题<br/>第2章 编辑网页元素<br/>2.1 文字与段落排版<br/>2.1.1 标题标签<h#>…</h#><br/>2.1.2 段落标签<p>…</p><br/>2.1.3 换行标签<br/><br/>2.1.4 水平线标签<hr/><br/>2.1.5 案例——制作光影世界关于我们页面<br/>2.2 列表<br/>2.2.1 无序列表<br/>2.2.2 有序列表<br/>2.2.3 定义列表<br/>2.2.4 嵌套列表<br/>2.3 超链接<br/>2.3.1 超链接的基本概念<br/>2.3.2 超链接的应用<br/>2.3.3 案例——制作光影世界服务向导页面<br/>2.4 图像<br/>2.4.1 Web中常用的图像格式及使用要点<br/>2.4.2 图像标签<img><br/>2.4.3 图文混排<br/>2.5 <div>标签<br/>2.6 <span>标签<br/>2.6.1 基本语法<br/>2.6.2 span与div的区别<br/>2.6.3 制作客照展示上传文件步骤及版权信息<br/>2.7 课堂综合实训——制作家具商城简介页面<br/>习题<br/>第3章 网页布局与交互<br/>3.1 表格<br/>3.1.1 表格的结构<br/>3.1.2 表格的基本语法<br/>3.1.3 表格修饰<br/>3.1.4 不规范表格<br/>3.1.5 表格数据的分组标签<br/>3.1.6 使用表格实现页面局部布局<br/>3.2 表单<br/>3.2.1 表单的工作机制<br/>3.2.2 表单标签<br/>3.2.3 表单元素<br/>3.2.4 案例——制作光影世界会员注册表单<br/>3.2.5 使用表格布局表单<br/>3.3 课堂综合实训——制作家具商城客服中心表单<br/>习题<br/>第4章 CSS样式基础<br/>4.1 初识CSS<br/>4.1.1 CSS标准<br/>4.1.2 CSS的发展历史<br/>4.1.3 CSS代码规范<br/>4.1.4 CSS的工作环境<br/>4.2 HTML与CSS<br/>4.2.1 传统HTML的缺点<br/>4.2.2 CSS的优点<br/>4.2.3 CSS的局限性<br/>4.3 CSS的定义与使用<br/>4.3.1 行内样式<br/>4.3.2 内部样式表<br/>4.3.3 链入外部样式表<br/>4.3.4 导入外部样式表<br/>4.3.5 案例——制作光影世界服务简介页面<br/>4.4 CSS语法基础<br/>4.4.1 CSS样式规则<br/>4.4.2 基本选择符<br/>4.4.3 复合选择符<br/>4.4.4 通用选择符<br/>4.4.5 属性选择符<br/>4.4.6 特殊选择符<br/>4.5 CSS的属性单位<br/>4.5.1 长度、百分比单位<br/>4.5.2 色彩单位<br/>4.6 文档结构<br/>4.6.1 文档结构的基本概念<br/>4.6.2 继承<br/>4.6.3 样式表的层叠、特殊性与重要性<br/>4.6.4 元素类型<br/>4.6.5 案例——制作光影世界作品欣赏明细页面<br/>4.7 课堂综合实训——使用CSS制作家具商城简介页面<br/>习题<br/>第5章 CSS盒模型<br/>5.1 盒模型简介<br/>5.2 边框、外边距与内边距<br/>5.2.1 边框<br/>5.2.2 外边距<br/>5.2.3 内边距<br/>5.3 盒模型的宽度与高度<br/>5.4 块级元素与行级元素宽度和高度的区别<br/>5.5 盒子的margin叠加问题<br/>5.5.1 行级元素之间的水平margin叠加<br/>5.5.2 块级元素之间的垂直margin叠加<br/>5.6 盒模型综合案例——制作光影世界高端外景局部页面<br/>5.7 盒子的定位<br/>5.7.1 定位属性<br/>5.7.2 定位方式<br/>5.8 浮动与清除浮动<br/>5.8.1 浮动<br/>5.8.2 清除浮动<br/>5.9 课堂综合实训——家具商城登录页面整体布局<br/>习题<br/>第6章 Div+CSS布局页面<br/>6.1 Div+CSS布局技术简介<br/>6.1.1 Div+CSS布局的优点<br/>6.1.2 使用嵌套的Div实现页面排版<br/>6.2 典型的CSS布局样式<br/>6.2.1 两列布局样式<br/>6.2.2 三列布局样式<br/>6.3 综合案例——制作光影世界最近活动局部页面<br/>6.3.1 页面布局规划<br/>6.3.2 页面的制作过程<br/>6.4 课堂综合实训——制作家具商城产品明细局部页面<br/>6.4.1 页面布局规划<br/>6.4.2 页面的制作过程<br/>习题<br/>第7章 使用CSS修饰网页元素<br/>7.1 文本控制<br/>7.1.1 设置字体的类别<br/>7.1.2 设置字体的尺寸<br/>7.1.3 设置字体的粗细<br/>7.1.4 设置字体的倾斜<br/>7.1.5 设置文字的颜色<br/>7.1.6 设置文字的背景颜色<br/>7.1.7 设置文本的修饰<br/>7.2 段落控制<br/>7.2.1 设置文字的对齐方式<br/>7.2.2 设置段落的首行缩进<br/>7.2.3 设置首字下沉<br/>7.2.4 设置行高<br/>7.2.5 设置字符间距<br/>7.2.6 设置文字的截断<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.4 设置表格样式<br/>7.4.1 常用的CSS表格属性<br/>7.4.2 案例——使用隔行换色表格制作畅销活动排行榜<br/>7.5 设置表单样式<br/>7.5.1 使用CSS美化常用的表单元素<br/>7.5.2 案例——制作光影世界联系我们表单<br/>7.6 综合案例——制作光影世界网络融资平台页面<br/>7.6.1 页面布局规划<br/>7.6.2 页面的制作过程<br/>7.7 课堂综合实训——制作家具商城会员注册页面<br/>习题<br/>第8章 使用CSS修饰链接与列表<br/>8.1 制作超链接特效<br/>8.1.1 动态超链接<br/>8.1.2 浮雕背景超链接<br/>8.1.3 按钮式超链接<br/>8.2 修饰列表<br/>8.2.1 表格布局的缺点<br/>8.2.2 列表布局的优势<br/>8.2.3 CSS列表属性<br/>8.3 综合案例——制作光影世界风景图文列表<br/>8.4 课堂综合实训——制作家具商城友情链接局部页面<br/>习题<br/>第9章 使用CSS制作导航菜单<br/>9.1 垂直导航菜单<br/>9.1.1 普通的垂直链接导航菜单<br/>9.1.2 纵向列表垂直导航菜单<br/>9.2 水平导航菜单<br/>9.3 综合案例——使用CSS美化和布局页面<br/>9.3.1 页面布局规划<br/>9.3.2 页面的制作过程<br/>9.4 课堂综合实训——制作家具商城关于页面<br/>习题<br/>第10章 网页行为语言——JavaScript<br/>10.1 JavaScript简介<br/>10.2 在网页中插入JavaScript<br/>10.3 JavaScript交互基本方法<br/>10.3.1 信息对话框<br/>10.3.2 选择对话框<br/>10.3.3 提示对话框<br/>10.4 制作网页特效<br/>10.4.1 幻灯片切换广告<br/>10.4.2 制作网页Tab选项卡切换效果<br/>10.4.3 循环滚动的图文字幕<br/>10.5 课堂综合实训——制作家具商城家具展示页面<br/>习题248<br/>第11章 光影世界前台页面<br/>11.1 网站的开发流程<br/>11.1.1 规划站点<br/>11.1.2 网站制作<br/>11.1.3 测试网站<br/>11.1.4 发布站点<br/>11.2 设计首页布局<br/>11.2.1 创建站点目录<br/>11.2.2 页面布局规划<br/>11.3 首页的制作<br/>11.4 制作作品欣赏列表页<br/>11.5 制作新闻动态列表页<br/>11.6 制作新闻明细页<br/>习题 <br/>第12章 光影世界后台管理页面<br/>12.1 制作后台管理登录页面<br/>12.2 制作查询新闻页面<br/>12.3 制作添加新闻页面<br/>12.4 制作修改新闻页面<br/>12.5 网站的整合<br/>习题 </div>
<a href="javascript:void(0);" class="tpml-all"></a>
</div>
</div>
<!-- 评价 -->
<div class="tab-main" style="display: none;">
<form id="search_form" action="" method="get">
<input type="hidden" value="evaluate" name="cur">
<input type="hidden" name="textbook_id" value="487582">
<input type="hidden" name="page" id="search_form_page" value="1">
</form>
<div class="table-H">
<span>好评度</span>
</div>
<ul class="pjBox">
<li>
<div class="pjStar">
<p>内容评价
<label class="star-box">
<i class="on"></i>
<i class="on"></i>
<i class="on"></i>
<i></i>
<i></i>
</label>
</p>
<p>质量评价
<label class="star-box">
<i class="on"></i>
<i class="on"></i>
<i class="on"></i>
<i></i>
<i></i>
</label>
</p>
</div>
</li>
</ul>
<div class="table-H">
<span>全部评价</span>
</div>
<ul class="pjBox">
<li>
<img src="https://img.aijiaocai.com/cover_ext/isbn/9787111580355.jpg" onerror="javascript:this.src='/images/defaultbookcover.jpg';"/>
<div>
李钒睿<br/>
2020-08-16 22:32:15 </div>
<div class="pjStar">
<p>内容评价
<label class="star-box">
<i class="on"></i>
<i class="on"></i>
<i class="on"></i>
<i class="on"></i>
<i class="on"></i>
</label>
</p>
<p>质量评价
<label class="star-box">
<i class="on"></i>
<i class="on"></i>
<i class="on"></i>
<i class="on"></i>
<i class="on"></i>
</label>
</p>
</div>
</li>
<li>
<img src="https://img.aijiaocai.com/covers/9787111580355.jpg" onerror="javascript:this.src='/images/defaultbookcover.jpg';"/>
<div>
候麟<br/>
2020-01-09 20:53:50 </div>
<div class="pjStar">
<p>内容评价
<label class="star-box">
<i class="on"></i>
<i></i>
<i></i>
<i></i>
<i></i>
</label>
</p>
<p>质量评价
<label class="star-box">
<i class="on"></i>
<i></i>
<i></i>
<i></i>
<i></i>
</label>
</p>
</div>
</li>
</ul>
<div id="page" class="page_div"></div>
</div>
</div>
</div>
</div>
</div>
<script type="text/javascript">
$(function () {
var cur = "default";
if (cur == 'evaluate') {
$('#evaluate').addClass('cur').siblings('a').removeClass('cur');
$('.tab-main').hide().eq($('#evaluate').index()).show();
} else if (cur == 'default') {
$('#default').addClass('cur').siblings('a').removeClass('cur');
$('.tab-main').hide().eq($('#default').index()).show();
}
if ($('.tpml').height() > 250) {
$('.tpml-all').html('展开更多')
$('.tpml').css('height', '250px')
}
if ($('.content-caixuan').height() > 85) {
$('.content-caixuan-all').html('查看全部')
$('.content-caixuan').css('height', '85px')
}
if ($('.author').height() > 50) {
$('.author-all').html('查看全部')
$('.author').css('height', '50px')
}
});
Look = {};
Look.tanBox = function (box_id) {
tanBox(box_id);
};
$("#page").paging({
pageNo: $("#search_form_page").val(),
totalPage: 1,
totalSize: 2,
callback: function (num) {
jumpto(num)
}
});
$('.author-all').click(function () {
if ($(this).html() === '查看全部') {
var $con = $(this).html('收起').prev('div');
$con.css('height', '100%');
} else {
var $con = $(this).html('查看全部').prev('div');
$con.css('height', '50px');
$con.css('overflow', 'hidden');
}
});
$('.content-caixuan-all').click(function () {
if ($(this).html() === '查看全部') {
var $con = $(this).html('收起').prev('div');
$con.css('height', '100%');
} else {
var $con = $(this).html('查看全部').prev('div');
$con.css('height', '85px');
$con.css('overflow', 'hidden');
}
});
$('.tpml-all').click(function () {
if ($(this).html() === '展开更多') {
var $con = $(this).html('收起').prev('div');
$con.css('height', '100%');
} else {
var $con = $(this).html('展开更多').prev('div');
$con.css('height', '250px');
$con.css('overflow', 'hidden');
}
});
$(".table-tab a").click(function () {
$(this).addClass('cur').siblings('a').removeClass('cur');
$('.tab-main').hide().eq($(this).index()).show();
$(".table-radio label:visible").attr("style", "border:0");
if ($(".table-radio label:visible").length == 1) {
$(".table-radio").hide();
}
})
</script>
<div class="fri-link foot-link">
<span class="fri-link-dt">友情链接</span>
<a class="fri-link-item fri-link-item1" href="http://cn.cnpubg.com/" target="_blank">中国出版集团公司</a>
<a class="fri-link-item" target="_blank" href="http://www.xhsdzd.com/">新华书店总店</a>
<a class="fri-link-item" target="_blank" href="http://www.pac.org.cn/">中国出版协会</a>
<a class="fri-link-item" target="_blank" href="http://www.crs1992.com/">中国编辑学会</a>
<a class="fri-link-item" target="_blank" href="http://www.hep.com.cn/">高等教育出版社</a>
<a class="fri-link-item" target="_blank" href="http://www.cmpedu.com/">机械工业出版社</a>
<a class="fri-link-item" target="_blank" href="http://www.sciencep.com/">科学出版社</a>
<a class="fri-link-item" target="_blank" href="http://www.cip.com.cn/">化学工业出版社</a>
<a class="fri-link-item" target="_blank" href="http://www.cepp.sgcc.com.cn/">中国电力出版社</a>
<a class="fri-link-item" target="_blank" href="https://www.phei.com.cn/">电子工业出版社</a>
<a class="fri-link-item" target="_blank" href="http://www.ccpcl.com.cn/">人民交通出版社</a>
<a class="fri-link-item" target="_blank" href="http://www.crup.com.cn/">中国人民大学出版社</a>
<a class="fri-link-item" target="_blank" href="http://www.pup.cn/">北京大学出版社</a>
<a class="fri-link-item" target="_blank" href="http://www.tup.tsinghua.edu.cn/index.html">清华大学出版社</a>
<a class="fri-link-item" target="_blank" href="http://www.ryjiaoyu.com.cn">人民邮电出版社</a>
<a class="fri-link-item" target="_blank" href="http://www.ccap.com.cn/">中国农业出版社</a>
<a class="fri-link-item" target="_blank" href="http://www.cabp.com.cn/">中国建筑工业出版社</a>
<a class="fri-link-item" target="_blank" href="https://www.pmph.com/">人民卫生出版社</a>
<a class="fri-link-item" target="_blank" href="http://dutp.dlut.edu.cn">大连理工大学出版社</a>
<a class="fri-link-item" target="_blank" href="http://www.bitpress.com.cn/">北京理工大学出版社</a>
<a class="fri-link-item" target="_blank" href="http://www.zzup.cn/">郑州大学出版社</a>
<a class="fri-link-item" target="_blank" href="http://www.bnump.com/">北京师范大学出版社</a>
<a class="fri-link-item" target="_blank" href="https://nkup.nankai.edu.cn/">南开大学出版社</a>
<a class="fri-link-item" target="_blank" href="http://www.wdp.com.cn/book/bookIndex.action">武汉大学出版社</a>
<a class="fri-link-item" target="_blank" href="http://www.textbookcenter.cn">北京出版社</a>
<a class="fri-link-item" target="_blank" href="http://www.gph.com.cn/">地质出版社</a>
<a class="fri-link-item" target="_blank" href="http://www.dufep.cn">东北财经大学出版社有限责任公司</a>
<a class="fri-link-item" target="_blank" href="http://www.lawpress.com.cn/">法律出版社有限公司</a>
<a class="fri-link-item" target="_blank" href="http://www.castp.cn/">中国农业科学技术出版社</a>
<a class="fri-link-item" target="_blank" href="https://press.ustc.edu.cn/">中国科学技术大学出版社</a>
<a class="fri-link-item" target="_blank" href="https://www.cqup.com.cn/">重庆大学出版社</a>
<a class="fri-link-item" target="_blank" href="http://xdcbs.com/">西南大学出版社</a>
<a class="fri-link-item" target="_blank" href="http://www.jiaodapress.com.cn/">上海交通大学出版社</a>
<a class="fri-link-item" target="_blank" href="http://www.waterpub.com.cn/">中国水利水电出版社</a>
<a class="fri-link-item" target="_blank" href="http://www.ecnupress.com.cn/">华东师范大学出版社</a>
<a class="fri-link-item" target="_blank" href="https://www.fltrp.com/">外语教学与研究出版社</a>
<a class="fri-link-item" target="_blank" href="http://www.fudanpress.com/">复旦大学出版社</a>
<a class="fri-link-item" target="_blank" href="http://www.cptcm.com/">中国中医药出版社</a>
</div>
<!--页面底部 start-->
<div class="footer">
<div class="footerBox">
<div class="footerTop">
© 2018-2025 新华国采教育网络科技有限责任公司 版权所有
</div>
<ul>
<li style="width:25%;">
<p>客服热线：010-88362023、010-88361712</p>
<p><a target="_blank" href="https://beian.miit.gov.cn/" class="icp_num">京ICP备16053406号</a></p>
</li>
<li style="width:35%;">
<p>出版物经营许可证：新出发京零字第西160035号</p>
<p>京公网安备 11010202007778号<img src="/images/ip.jpg"></p>
</li>
<li style="width: 40%;">
<p>信息系统安全等级保护（三级）备案证明编号：11010243697-20001</p>
<p>增值电信业务经营许可证编号：京B2-20170886</p>
</li>
</ul>
</div>
</div>
<!--页面底部 end-->
</body>
</html>
<script>
var _hmt = _hmt || [];
(function () {
var hm = document.createElement("script");
hm.src = "https://hm.baidu.com/hm.js?8c456308ba2e540841c85599c32c7d67";
var s = document.getElementsByTagName("script")[0];
s.parentNode.insertBefore(hm, s);
})();
</script>
<script>
(function () {
var script = document.createElement("script");
script.src = "https://log.aijiaocai.cn/static/app/dist/api-v1-fetch.js";
var s = document.getElementsByTagName("script")[0];
s.parentNode.insertBefore(script, s);
if (script.addEventListener) {
script.addEventListener('load', function () {
browseLog();
}, false);
} else if (script.attachEvent) {
script.attachEvent('onreadystatechange', function () {
var target = window.event.srcElement;
if (target.readyState == 'loaded') {
browseLog();
}
});
}
function browseLog() {
var options = {sysCode: 'xhgc.aijiaocai.textbooking.web', sysName: '采选系统PC端', autoBrowse: false};
var info = {
operateType: 'browse',
userCode: '',
realName: '',
orgCode: '',
content: {login_type: ''}
};
var logCenterLogger = new logCenter.Logger(options);
logCenterLogger.log(info);
}
})();
</script>
1.1 网页与网站的概念
1.2 Web标准
1.2.1 Web标准的概念
1.2.2 建立Web标准的优点
1.2.3 理解表现和结构相分离
1.3 HTML语法基础
1.3.1 HTML简介
1.3.2 HTML语法结构
1.3.3 HTML语法规范
1.3.4 HTML文档结构
1.4 网页结构
1.5 创建HTML文档
1.6 页面摘要信息
1.6.1