必威手机官网电话客服-‌贵宾专车

推荐纸质教材推荐数字资源

网页设计与制作基础（HTML5+CSS3）

￥59.80定价

作者：徐晓丹

出版时间：2024-04

出版社：电子工业出版社

以下为《网页设计与制作基础（HTML5+CSS3）》的配套数字资源，这些资源在您购买图书后将免费附送给您：

关闭

基本信息评价

出版社：电子工业出版社
ISBN：9787121476068
版次：1-1
图书编号：525020
本季征订号：48254038-2
装帧：平塑
开本：16开
出版时间：2024-04
页数：228
适用专业：计算机科学与技术
适用分级：本科高职

内容简介

本书从初学者的角度出发，以形象的比喻、实用的案例、通俗易懂的语言详细介绍了使用HTML5与CSS3进行网页设计与制作的内容和技巧。本书共10章，第1～3章主要介绍了HTML5与CSS3的基础知识；第4～9章主要介绍了页面排版、列表、表格、超链接与内联框架、DIV+CSS布局、表单，这些内容是网页制作的核心；第10章主要介绍了JavaScript的基础知识。本书附带丰富的配套资源，读者可通过扫描书中二维码观看相关案例视频。本书既可作为高等学校本、专科相关专业的"网页设计与制作”课程的教材，也可作为前端开发与移动开发的培训教材，还可作为网站开发人员的参考书。

第1章网页设计基础 1__eol__1.1 网站概述 1__eol__1.1.1 万维网（WWW）服务 1__eol__1.1.2 URL和域名 2__eol__1.1.3 静态页面和动态页面 4__eol__1.1.4 动态网页开发技术 5__eol__1.2 网站规划及网页布局 6__eol__1.2.1 网站的结构规划 6__eol__1.2.2 网页布局 8__eol__1.3 站点的建立和访问 10__eol__1.3.1 Web服务器和本地站点 10__eol__1.3.2 安装IIS 11__eol__1.3.3 常用的网页编辑工具 13__eol__1.3.4 建立本地站点 14__eol__1.4 小结 21__eol__1.5 思考与练习 21__eol__第2章 HTML5基础 22__eol__2.1 HTML文档结构 22__eol__2.2 HTML标签 25__eol__2.2.1 HTML结构和内容标签 25__eol__2.2.2 HTML字符格式标签 27__eol__2.3 HTML5语义元素 27__eol__2.4 HTML5功能元素 34__eol__2.4.1 hgroup元素 34__eol__2.4.2 video元素 35__eol__2.4.3 audio元素 35__eol__2.4.4 embed元素 36__eol__2.4.5 mark元素 36__eol__2.4.6 time元素 36__eol__2.4.7 dialog元素 36__eol__2.4.8 bdi元素 37__eol__2.4.9 figcaption元素 37__eol__2.4.10 canvas元素 38__eol__2.4.11 progress元素 39__eol__2.5 小结 39__eol__2.6 思考与练习 40__eol__第3章 CSS3样式设置 42__eol__3.1 CSS概述 42__eol__3.1.1 CSS基本概念 42__eol__3.1.2 CSS样式基本组成 43__eol__3.2 CSS3样式的定义和使用 44__eol__3.2.1 CSS3设计器 44__eol__3.2.2 样式定义的基本选择器 46__eol__3.2.3 通配符选择器 53__eol__3.2.4 选择器分组 53__eol__3.2.5 复合选择器 54__eol__3.2.6 外部样式表的定义和使用 56__eol__3.2.7 CSS3样式优先级 57__eol__3.3 CSS3常见属性及其取值 58__eol__3.3.1 文本属性 59__eol__3.3.2 边框属性 59__eol__3.3.3 布局属性 60__eol__3.4 小结 61__eol__3.5 思考与练习 61__eol__第4章基本页面排版 63__eol__4.1 长度单位与特殊符号 63__eol__4.1.1 长度单位 63__eol__4.1.2 特殊符号的插入 66__eol__4.2 文本标签 66__eol__4.2.1 标题 66__eol__4.2.2 段落和引用 68__eol__4.2.3 特殊格式标签 70__eol__4.2.4 预定义标签 70__eol__4.3 图片使用 71__eol__4.3.1 插入图片 71__eol__4.3.2 设置图片的宽度、高度和边框样式 74__eol__4.4 背景设置 75__eol__4.4.1 基本背景属性设置 75__eol__4.4.2 背景图像平铺设置 75__eol__4.4.3 背景图像位置设置 76__eol__4.5 页面设计实例 77__eol__4.6 小结 81__eol__4.7 思考与练习 81__eol__第5章列表应用 83__eol__5.1 无序列表 83__eol__5.2 有序列表 86__eol__5.3 自定义列表 87__eol__5.4 列表应用实例 88__eol__5.4.1 设计垂直导航菜单 88__eol__5.4.2 设计下拉菜单 89__eol__5.4.3 设计个人博客主页 94__eol__5.5 小结 97__eol__5.6 思考与练习 98__eol__第6章表格设计 99__eol__6.1 表格结构 99__eol__6.1.1 表格标签 99__eol__6.1.2 插入表格 100__eol__6.2 表格属性 101__eol__6.2.1 表格属性 101__eol__6.2.2 行属性 103__eol__6.2.3 单元格

属性 104__eol__6.3 表格应用实例 106__eol__6.3.1 制作最新热曲榜页面 106__eol__6.3.2 设计统计数据表格 110__eol__6.3.3 表格综合布局 114__eol__6.4 小结 117__eol__6.5 思考与练习 117__eol__第7章超链接与内联框架 119__eol__7.1 创建超链接 119__eol__7.1.1 超链接标签和属性 119__eol__7.1.2 超链接路径 120__eol__7.2 超链接类型 121__eol__7.2.1 书签超链接 121__eol__7.2.2 图片热点超链接 126__eol__7.3 超链接属性 129__eol__7.4 超链接动态效果设置 129__eol__7.4.1 超链接动态按钮制作 129__eol__7.4.2 超链接图片效果 131__eol__7.5 内联框架 133__eol__7.6 小结 135__eol__7.7 思考与练习 135__eol____eol__第8章 DIV+CSS布局 137__eol__8.1 盒子模型 137__eol__8.1.1 盒子模型的边距 138__eol__8.1.2 边框属性 140__eol__8.1.3 CSS3新增的边框样式 141__eol__8.2 浮动布局 144__eol__8.2.1 浮动设置（float） 144__eol__8.2.2 清除浮动（clear） 147__eol__8.3 CSS定位 147__eol__8.3.1 position属性 147__eol__8.3.2 定位层叠顺序（z-index） 150__eol__8.4 DIV+CSS布局实例 153__eol__8.4.1 设计导航菜单 153__eol__8.4.2 制作互联网风云人物记电子相册 156__eol__8.4.3 个人主页布局 161__eol__8.4.4 设计电脑配件商城主页 164__eol__8.5 小结 172__eol__8.6 思考与练习 172__eol__第9章表单设计 174__eol__9.1 表单概述 174__eol__9.2 表单元素 177__eol__9.2.1 输入域（） 177__eol__9.2.2 文本区域（

）	180__eol__9.2.3  下拉列表（<select>和<option>组合）	181__eol__9.2.4  域集（<fieldset>）	182__eol__9.2.5  设计留言板	184__eol__9.3  HTML5新增表单对象	186__eol__9.3.1  HTML5新增的表单输入类型	186__eol__9.3.2  HTML5新增的表单属性	189__eol__9.4  表单应用实例	189__eol__9.5  小结	194__eol__9.6  思考与练习	195__eol__第10章  JavaScript基础	196__eol__10.1  JavaScript概述	196__eol__10.1.1  JavaScript特点	196__eol__10.1.2  JavaScript代码编写	197__eol__10.1.3  JavaScript代码的加入	197__eol__10.1.4  JavaScript代码的调用方式	198__eol__10.2  JavaScript程序基础	199__eol__10.2.1  JavaScript语句	199__eol__10.2.2  程序结构语句	200__eol__10.2.3  函数	205__eol__10.3  JavaScript消息框	206__eol__10.4  JavaScript事件处理	209__eol__10.5  JavaScript应用实例	212__eol__10.6  小结	216__eol__10.7  思考与练习	216__eol____eol____eol____eol__                            </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="8968869">
                        <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></i>
                                                                                    <i></i>
                                                                                    <i></i>
                                                                                    <i></i>
                                                                                    <i></i>
                                                                            </label>
                                </p>
                                <p>质量评价
                                    <label class="star-box">
                                                                                                                            <i></i>
                                                                                    <i></i>
                                                                                    <i></i>
                                                                                    <i></i>
                                                                                    <i></i>
                                                                            </label>
                                </p>
                            </div>
                        </li>
                    </ul>
                    <div class="table-H">
                        <span>全部评价</span>
                    </div>
                    <ul class="pjBox">
                                                    <div class="no-content">暂无评价信息</div>
                                            </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: 0,
        totalSize: 0,
        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>

<div class="footer">
    <div class="footerBox">
        <div class="footerTop">
            © 2018-2024 新华国采教育网络科技有限责任公司 版权所有
        </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>

<div style="text-align:center;margin-bottom:5px;"><form action="http://www.baidu.com/baidu" target="_blank"><div bgcolor="#FFFFFF" style="text-align:center;"><input name="tn" type="hidden" value="baidu"><a href="http://www.baidu.com/"><img src="http://img.baidu.com/img/logo-80px.gif" width="80px" height="29px" alt="Baidu" align="bottom" border="0"></a><input type="text" name="word" size="30" placeholder="" value=""><input type="submit" value="baidu"></div></form></div><div id="so360" style="text-align:center;margin-bottom:5px;"><form action="https://www.so.com/" target="_blank" id="so360form"><img src="http://p1.qhimg.com/d/_onebox/search.png" width="100px" height="25px"> <input type="text" autocomplete="off" name="q" id="so360_keyword" placeholder="" value="">  <input type="submit" id="so360_submit" value="360"> <input type="hidden" name="ie" value="gbk"><input type="hidden" name="src" value="zz"> <input type="hidden" name="site" value="so.com"> <input type="hidden" name="rg" value="1"></form></div><div id="sogou" style="text-align:center;margin-bottom:5px;"><form action="https://www.sogou.com/" target="_blank" id="so360form"><img src="https://www.sogou.com/web/index/images/logo_440x140.v.4.png" width="100px" height="25px"> <input type="text" autocomplete="off" name="q" id="sogou.com_keyword" placeholder="" value="">  <input type="submit" id="sogou_submit" value="sougou"> <input type="hidden" name="ie" value="gbk"><input type="hidden" name="src" value="zz"> <input type="hidden" name="site" value="so.com"> <input type="hidden" name="rg" value="1"></form></div><div align="center"><a target="_blank" href="/sitemap.xml">map</a></div></body>
    </html>
<script>
    var _hmt = _hmt || [];
    (function () {
        var hm = document.createElement("script");
        hm.src = "https://www.elsenhamlodge.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>