HTML＋CSS＋DIV网页设计与布局(21世纪高等教育计算机规划教材)

# HTML＋CSS＋DIV网页设计与布局(21世纪高等教育计算机规划教材)

内容简介
----

编辑播报  
本书以[HTML语言](https://baike.baidu.com/item/HTML%E8%AF%AD%E8%A8%80/2083246?fromModule=lemma_inlink)为基础，围绕最新的CSS技术精髓展开深入[讲解](https://baike.baidu.com/item/%E8%AE%B2%E8%A7%A3/1176505?fromModule=lemma_inlink)，主要内容包括认识网站开发、网页文字和图片、超链接、表格、多媒体、滚动字幕、列表、表单、框架、设置文本样式、设置网页背景样式、设置边框和边距样式、设置表格和列表样式、控制元素布局、网页布局与设计技巧等。 本书结构合理、条理清晰、实用性强，从第2章开始，每一个技术的讲解都附有具体的实例，可供读者实际操作使用。此外，每章都附有习题和上机指导，供课后练习和上机实验。 本书可以作为高等院校[计算机科学与技术](https://baike.baidu.com/item/%E8%AE%A1%E7%AE%97%E6%9C%BA%E7%A7%91%E5%AD%A6%E4%B8%8E%E6%8A%80%E6%9C%AF/663582?fromModule=lemma_inlink)、软件工程、网络工程、计算机应用等相关专业"网页设计"课程的教材，也可供从事[网页设计](https://baike.baidu.com/item/%E7%BD%91%E9%A1%B5%E8%AE%BE%E8%AE%A1/235026?fromModule=lemma_inlink)与制作人员自学参考。^\[1\]^

目录
---

编辑播报  
第一篇　认识网站和网页  
第1章　认识网站开发　2  
1.1　认识网站开发　2  
1.1.1　网页设计概述　2  
1.1.2　网页构成元素　2  
1.1.3　网站建设流程　3  
1.1.4　网站开发软件　4  
1.2　HTML基本概念　5  
1.2.1　HTML简介　6  
1.2.2　HTML基本结构　6  
1.3　一个简单的HTML实例　6  
1.3.1　编写HTML代码　6  
1.3.2　运行[HTML文件](https://baike.baidu.com/item/HTML%E6%96%87%E4%BB%B6/7176861?fromModule=lemma_inlink)查看效果　8  
1.4　HTML基本标记　8  
1.4.1　文件类型标记　8  
1.4.2　HTML头标记　9  
1.4.3　HTML主体标记　9  
1.4.4　页面标题　9  
1.5　小结　10  
本章习题　10  
第二篇　HTML学习篇  
第2章　网页文字和图片　12  
2.1　文字格式　12  
2.1.1　设置文字大小　12  
2.1.2　设置字体　13  
2.1.3　设置字体颜色　15  
2.1.4　加粗与斜体　18  
2.1.5　下划线与删除线　19  
2.1.6　上标与下标　20  
2.1.7　等宽字　21  
2.2　与文字排版相关的元素　21  
2.2.1　文本缩进　21  
2.2.2　换行　22  
2.2.3　段落　23  
2.2.4　段落居中　23  
2.2.5　预定义格式　24  
2.2.6　水平分隔线　25  
2.3　文字闪烁　26  
2.4　设置网页背景颜色　27  
2.5　在网页中插入图像　28  
2.6　设置背景图片　29  
2.7　小结　30  
本章习题　30  
上机指导　31  
实验一：练习使用FONT元素来设置文字的大小、颜色和字体　31  
实验二：练习使用与文字排版相关的元素来设置文字的段落的样式　31  
实验三：练习使用BACKGROUND属性来设置网页的背景图片　32  
第3章　超链接　34  
3.1　创建超链接　34  
3.1.1　超链接标记　34  
3.1.2　链接地址　35  
3.1.3　打开链接的方式　37  
3.2　锚点　37  
3.2.1　创建锚点　38  
3.2.2　链接到本页锚点　38  
3.2.3　链接到其他网页的锚点　39  
3.3　图像的超链接　40  
3.3.1　将整个图像设为超链接　40  
3.3.2　设置图像热点区域　41  
3.4　小结　43  
本章习题　43  
上机指导　44  
实验一：练习使用A标记创建一个以新窗口打开的超链接　44  
实验二：练习使用A标记创建一个链接到其他网页的锚点链接　44  
实验三：练习使用A标记设置一个矩形的图像热点区域　46  
第4章　表格　47  
4.1　创建表格　47  
4.2　表格属性　48  
4.2.1　表格宽度　48  
4.2.2　表格高度　49  
4.2.3　表格背景图片　51  
4.2.4　单元格间距　52  
4.2.5　表格内单元格与文字的距离　54  
4.3　表格边框　55  
4.3.1　边框宽度　55  
4.3.2　边框颜色　57  
4.3.3　亮边框颜色　58  
4.3.4　暗边框颜色　58  
4.4　设置表格行的对齐方式　59  
4.4.1　垂直对齐方式　59  
4.4.2　水平对齐方式　60  
4.5　行和列的合并　61  
4.5.1　列的合并　62  
4.5.2　行的合并　63  
4.6　表格结构　64  
4.6.1　表头　64  
4.6.2　主体　65  
4.6.3　表尾　66  
4.7　表格标题　68  
4.8　表格嵌套　69  
4.9　小结　70  
本章习题　71  
上机指导　72  
实验一：练习使用TABLE元素创建一个表格　72  
实验二：练习使用TABLE元素中的各种属性创建一个课程表　73  
实验三：练习使用TABLE元素创建嵌套表格　74  
第5章　多媒体、滚动字幕和列表　76  
5.1　[多媒体元素](https://baike.baidu.com/item/%E5%A4%9A%E5%AA%92%E4%BD%93%E5%85%83%E7%B4%A0/10114709?fromModule=lemma_inlink)　76  
5.1.1　插入多媒体元素　76  
5.1.2　循环播放　77  
5.1.3　自动播放　77  
5.1.4　隐藏多媒体元素　78  
5.2　插入背景音乐　80  
5.3　滚动字幕　80  
5.3.1　添加滚动字幕　81  
5.3.2　滚动方向　81  
5.3.3　滚动方式　82  
5.3.4　滚动字幕背景颜色　83  
5.3.5　滚动速度　84  
5.3.6　滚动延迟　84  
5.3.7　滚动次数　86  
5.3.8　滚动字幕空白空间　86  
5.3.9　设置鼠标经过效果　87  
5.4　无序列表　88  
5.4.1　无序列表结构　88  
5.4.2　无序列表的列表项样式　89  
5.5　有序列表　90  
5.5.1　有序列表结构　91  
5.5.2　有序列表的列表项样式　92  
5.6　嵌套列表　93  
5.7　定义列表　94  
5.8　目录列表　96  
5.9　菜单列表　96  
5.10　小结　98  
本章习题　98  
上机指导　99  
实验一：练习使用EMBED元素插入一个多媒体元素　99  
实验二：练习使用MARQUEE元素添加一个滚动字幕　100  
实验三：练习使用UL元素和OL元素创建一个嵌套列表　100  
第6章　表单　102  
6.1　添加表单　102  
6.1.1　链接跳转　102  
6.1.2　链接跳转方式　103  
6.1.3　表单名称　103  
6.2　输入标签　104  
6.2.1　文本框　104  
6.2.2　密码框　105  
6.2.3　单选框　105  
6.2.4　复选框　107  
6.2.5　提交按钮　107  
6.2.6　重置按钮　108  
6.2.7　图像按钮　109  
6.2.8　文件域　110  
6.2.9　隐藏域　111  
6.3　下拉列表　112  
6.4　文本域　113  
6.5　小结　114  
本章习题　114  
上机指导　115  
实验一：练习使用FORM元素插入一个表单　115  
实验二：练习在表单元素中添加不同的表单控件　116  
实验三：练习使用在表单元素中添加下拉列表　117  
第7章　框架　118  
7.1　创建框架　118  
7.2　分割窗口　118  
7.2.1　上下分割　118  
7.2.2　左右分割　121  
7.2.3　窗口的嵌套　122  
7.3　设置框架边框　123  
7.3.1　设置框架边框显示或隐藏　123  
7.3.2　设置框架边框宽度　124  
7.3.3　设置框架边框颜色　125  
7.4　框架属性　126  
7.4.1　设置框架滚动条显示　126  
7.4.2　固定框架　126  
7.4.3　不支持框架标记　128  
7.5　在框架中使用链接　128  
7.6　浮动框架　132  
7.6.1　插入浮动框架　132  
7.6.2　浮动框架大小　133  
7.6.3　浮动框架对齐方式　133  
7.6.4　浮动框架页面的链接　134  
7.7　小结　135  
本章习题　136  
上机指导　137  
实验一：练习使用FRAMESET元素创建一个框架　137  
实验二：练习使用FRAMESET元素创建一个嵌套框架　138  
实验三：练习使用IFRAME元素创建一个浮动框架　138  
第三篇　CCS学习篇  
第8章　认识CSS　141  
8.1　CSS简介　141  
8.2　[CSS样式表](https://baike.baidu.com/item/CSS%E6%A0%B7%E5%BC%8F%E8%A1%A8/224735?fromModule=lemma_inlink)的设置方法　141  
8.2.1　内联样式表　141  
8.2.2　[内部样式表](https://baike.baidu.com/item/%E5%86%85%E9%83%A8%E6%A0%B7%E5%BC%8F%E8%A1%A8/2886423?fromModule=lemma_inlink)　142  
8.2.3　外部样式表　143  
8.2.4　引用多个样式表　144  
8.2.5　使用@import引用外部样式表　145  
8.2.6　CSS注释　146  
8.3　选择符　147  
8.3.1　类型选择符　147  
8.3.2　类选择符　148  
8.3.3　ID选择符　151  
8.3.4　包含选择符　152  
8.3.5　选择符分组　156  
8.3.6　通用选择符　157  
8.3.7　子选择符　159  
8.3.8　相邻选择符　161  
8.3.9　属性选择符　162  
8.4　伪类和伪元素　166  
8.4.1　超链接的伪类　167  
8.4.2　伪元素　168  
8.5　CSS优先级　169  
8.6　CSS中的单位　172  
8.6.1　颜色单位　172  
8.6.2　长度单位　172  
8.6.3　时间单位　173  
8.6.4　角度单位　173  
8.6.5　频率单位　173  
8.7　小结　173  
本章习题　173  
上机指导　175  
实验一：练习使用CSS内部样式表设置网页样式　175  
实验二：练习使用CSS外部样式表设置网页样式　175  
实验三：练习使用CSS伪类设置超链接的样式　176  
第9章　设置文字和文本样式　178  
9.1　设置文字样式　178  
9.1.1　字体设置　178  
9.1.2　设置文字大小　179  
9.1.3　设置粗体　181  
9.1.4　设置文字颜色　181  
9.1.5　设置斜体　183  
9.1.6　综合设置　183  
9.2　设置文本样式　184  
9.2.1　设置阴影效果　185  
9.2.2　大小写转换　185  
9.2.3　文本缩进　187  
9.2.4　文本的水平对齐方式　188  
9.2.5　文本的垂直对齐方式　189  
9.2.6　设置文本流入方向　191  
9.2.7　设置文本修饰　192  
9.3　空白与换行　193  
9.3.1　空格的处理方式　194  
9.3.2　字内换行　195  
9.4　设置间距　197  
9.4.1　行间距　197  
9.4.2　字间距　199  
9.4.3　词间距　201  
9.5　小结　203  
本章习题　203  
上机指导　203  
实验一：练习使用font属性综合设置文字样式　204  
实验二：练习使用不同的属性设置文本的样式　204  
实验三：练习使用不同的属性设置文本的间距　205  
第10章　设置背景、边框、边距和补白　206  
10.1　背景颜色　206  
10.2　背景图像　207  
10.2.1　设置背景图像　207  
10.2.2　设置固定背景图像　209  
10.2.3　设置背景图像平铺方式　210  
10.2.4　背景图像定位　213  
10.3　边框　215  
10.3.1　设置边框样式　215  
10.3.2　设置不同的边框样式　217  
10.3.3　设置边框宽度　218  
10.3.4　设置不同的边框宽度　220  
10.3.5　设置边框颜色　222  
10.3.6　设置不同的边框颜色　224  
10.3.7　综合设置边框效果　225  
10.4　边距　226  
10.4.1　设置上边距　227  
10.4.2　设置下边距　227  
10.4.3　设置左边距　228  
10.4.4　设置右边距　229  
10.4.5　综合设置边距　230  
10.5　补白　231  
10.5.1　设置顶端补白　231  
10.5.2　设置底部补白　232  
10.5.3　设置左侧补白　233  
10.5.4　设置右侧补白　234  
10.5.5　综合设置补白　234  
10.6　小结　235  
本章习题　235  
上机指导　235  
实验一：练习使用背景图像属性综合设置背景图像的样式　237  
实验二：练习使用边框属性综合设置元素边框的样式　237  
实验三：练习使用margin属性和padding属性综合设置元素的边距和补白　238  
第11章　设置表格、列表和滚动条样式　240  
11.1　表格　240  
11.1.1　合并表格边框　240  
11.1.2　定义表格边框间距　242  
11.1.3　定义表格标题位置　244  
11.1.4　设置表格布局　246  
11.2　列表　248  
11.2.1　设置列表符号样式　248  
11.2.2　使用图片设置列表样式　251  
11.2.3　列表符号显示位置　252  
11.2.4　综合设置列表样式　253  
11.3　滚动条　254  
11.3.1　设置滚动条颜色　254  
11.3.2　设置滚动条亮边框颜色　255  
11.3.3　设置滚动条暗边框颜色　256  
11.3.4　设置滚动条方向箭头颜色　257  
11.3.5　设置滚动条基准色　258  
11.4　小结　260  
本章习题　260  
上机指导　260  
实验一：练习使用CSS中的表格属性设置表格的样式　261  
实验二：练习使用CSS中的列表属性设置列表的样式　261  
实验三：练习使用CSS中的滚动条属性设置滚动条的样式　262  
第四篇　布局学习篇  
第12章　控制元素布局　265  
12.1　块级元素和内联元素　265  
12.1.1　块级元素和内联元素的概念　265  
12.1.2　div元素和span元素　265  
12.2　定位　267  
12.2.1　定位方式　267  
12.2.2　偏移　268  
12.2.3　综合运用　268  
12.2.4　定位元素的层叠次序　272  
12.3　浮动　273  
12.3.1　浮动的概念　274  
12.3.2　设置浮动　274  
12.3.3　清除浮动　275  
12.4　溢出与剪切　276  
12.4.1　溢出内容的设置　277  
12.4.2　设置水平方向超出范围的处理方式　278  
12.4.3　设置垂直方向超出范围的处理方式　279  
12.4.4　内容的剪切　281  
12.5　对象的显示与隐藏　282  
12.6　小结　283  
本章习题　283  
上机指导　284  
实验一：练习使用定位设置元素的位置　284  
实验二：练习使用浮动设置元素的位置　285  
实验三：练习使用清除浮动清除元素的浮动效果　286  
第13章　网页布局与设计技巧　287  
13.1　网页布局　287  
13.1.1　网页大小　287  
13.1.2　网页栏目划分　288  
13.1.3　表格布局　289  
13.1.4　CSS布局　292  
13.2　CSS布局技巧　293  
13.2.1　一栏布局　293  
13.2.2　二栏布局　295  
13.2.3　多栏布局　296  
13.3　小结　298  
本章习题　298  
上机指导　299  
实验一：利用表格设计网页　299  
实验二：利用CSS设计网页　300  
实验三：利用CSS对网页进行布局　301  
第14章　网页布局综合案例------宝贝屋网上商店　302  
14.1　案例分析　302  
14.2　内容分析　303  
14.3　原型设计　303  
14.4　布局设计　305  
14.4.1　整体样式设计　305  
14.4.2　页头部分　306  
14.4.3　内容部分　310  
14.4.4　页脚部分　315  
14.5　交互效果设计　316  
14.5.1　顶部导航栏　316  
14.5.2　主导航栏　317  
14.5.3　账号区　317  
14.5.4　图像边框　317  
14.5.5　产品分类　318  
14.6　小结　318^\[1\]^

获取资源

热门资源

热门电子书

热门资源

热门电子书

友情提示