HTML、CSS、JavaScript网页制作从入门到精通

第1章　HTML基础

1.1　HTML的基本概念

1.1.1　HTML简介

1.1.2　HTML文件的基本结构

1.1.3　认识HTML标...

第1章　HTML基础

1.1　HTML的基本概念

1.1.1　HTML简介

1.1.2　HTML文件的基本结构

1.1.3　认识HTML标记

1.2　HTML文件的编写方法

1.2.1　使用记事本手工编写HTML

1.2.2　使用Dreamweaver编写HTML文件

1.3　使用浏览器浏览HTML文件

1.3.1　查看页面效果

1.3.2　查看源文件

1.4　练习题

第2章　HTML基本标记

2.1　HTML头部标记head

2.2　标题标记title

2.3　元信息标记meta

2.3.1　设置页面关键字

2.3.2　设置页面说明

2.3.3　定义编辑工具

2.3.4　设置作者信息

2.3.5　设置网页文字及语言

2.3.6　设置网页的定时跳转

2.4　网页的主体标记body

2.4.1　网页背景色bgcolor

2.4.2　网页背景图片background

2.4.3　文字颜色text

2.4.4　链接文字属性link

2.4.5　边距margin

2.5　页面注释标记

2.6　练习题

第3章　文字与段落标记

3.1　标题字

3.1.1　标题字标记h

3.1.2　标题字对齐属性align

3.2　文本基本标记

3.2.1　字体属性face

3.2.2　字号属性size

3.2.3　颜色属性color

3.3　文本格式化标记

3.3.1　粗体标记b、strong

3.3.2　斜体标记i、em、cite

3.3.3　上标标记sup

3.3.4　下标标记sub

3.3.5　大字号标记big

3.3.6　小字号标记small

3.3.7　下画线标记u

3.4　段落标记

3.4.1　段落标记p

3.4.2　换行标记br

3.4.3　不换行标记nobr

3.5　水平线

3.5.1　插入水平线hr

3.5.2　水平线宽度width

3.5.3　水平线高度size

3.5.4　水平线去掉阴影noshade

3.5.5　水平线颜色color

3.5.6　水平线排列align

3.6　其他标记

3.6.1　插入空格

3.6.2　插入特殊符号

3.7　练习题

第4章　使用图像

4.1　图像的格式

4.2　插入图像

4.2.1　插入图像标记img

4.2.2　图像的源文件src

4.2.3　图像的提示文字alt

4.2.4　图像的宽度和高度width、height

4.2.5　图像的边框border

4.2.6　图像的垂直边距vspace

4.2.7　图像的水平间距hspace

4.2.8　图像的排列align

4.3　图像的超链接

4.3.1　图像的超链接

4.3.2　图像热区链接

4.4　练习题

第5章　使用列表

5.1　认识列表标记

5.2　有序列表

5.2.1　有序列表ol

5.2.2　有序列表的序号类型type

5.2.3　有序列表的起始数值start

5.3　无序列表

5.3.1　无序列表标记

5.3.2　无序列表的类型type

5.3.3　目录列表标记

5.3.4　定义列表标记

5.3.5　菜单列表标记

5.4　练习题

第6章　使用表格

6.1　创建表格

6.1.1　表格的基本构成table、tr、td

6.1.2　设置表格的标题caption

6.1.3　表头th

6.2　表格基本属性

6.2.1　表格宽度width

6.2.2　表格高度height

6.2.3　表格对齐方式align

6.3　表格的边框

6.3.1　表格边框宽度border

6.3.2　表格边框颜色bordercolor

6.3.3　内框宽度cellspacing

6.3.4　表格内文字与边框间距cellpadding

6.4　表格背景

6.4.1　表格背景颜色bgcolor

6.4.2　表格背景图像

6.5　表格的行属性

6.5.1　高度控制height

6.5.2　边框颜色bordercolor

6.5.3　行背景bgcolor、background

6.5.4　行文字的水平对齐方式align

6.5.5　行文字的垂直对齐方式valign

6.6　单元格属性

6.6.1　单元格大小width、height

6.6.2　水平跨度colspan

6.6.3　垂直跨度rowspan

6.6.4　对齐方式align、valign

6.6.5　单元格的背景色

6.6.6　单元格的边框颜色bordercolor

6.6.7　单元格的亮边框bordercolorlight

6.6.8　单元格的暗边框bordercolordark

6.6.9　单元格的背景图像background

6.7　表格的结构

6.7.1　表格的表首标记

6.7.2　表格的表主体标记

6.7.3　表格的表尾标记

6.8　练习题

第7章　建立超链接

7.1　超链接的基本知识

7.1.1　绝对路径

7.1.2　相对路径

7.2　内部链接

7.2.1　认识内部链接

7.2.2　链接的目标窗口

7.3　锚点链接

7.3.1　建立锚点

7.3.2　链接同一页面中的锚点

7.3.3　链接到其他页面中的锚点

7.4　外部链接

7.4.1　链接到外部网站

7.4.2　链接到E-mail

7.4.3　链接到FTP

7.4.4　链接到Telnet

7.4.5　下载文件

7.5　练习题

第8章　添加多媒体

8.1　设置滚动效果

8.1.1　滚动标记marquee

8.1.2　滚动方向direction

8.1.3　滚动方式behavior

8.1.4　滚动速度scrollamount

8.1.5　滚动延迟scrolldelay

8.1.6　滚动循环loop

8.1.7　滚动范围width、height

8.1.8　滚动背景颜色bgcolor

8.1.9　空白空间hspace、vspace

8.2　插入多媒体文件

8.2.1　插入Flash动画

8.2.2　插入音频和视频文件

8.3　设置背景音乐

8.3.1　背景音乐bgsound

8.3.2　循环次数loop

8.4　插入Java Applet

8.5　练习题

第9章　使用框架结构

9.1　框架的基本概念

9.2　设置框架集的属性frameset

9.2.1　水平分割窗口rows

9.2.2　垂直分割窗口cols

9.2.3　嵌套分割窗口

9.2.4　框架的边框frameborder

9.2.5　框架的边框宽度framespacing

9.2.6　框架的边框颜色bordercolor

9.3　设置窗口属性frame

9.3.1　页面源文件src

9.3.2　页面名称name

9.3.3　禁止调整窗口的尺寸noresize

9.3.4　边框与页面内容的水平边距marginwidth

9.3.5　边框与页面内容的垂直边距marginheight

9.3.6　控制框架滚动条显示scrolling

9.3.7　不支持框架标记noframes

9.4　浮动框架iframe

9.4.1　页面源文件src

9.4.2　浮动框架的宽和高width、height

9.4.3　浮动框架的对齐方式align

9.4.4　浮动框架滚动条显示属性scrolling

9.5　创建框架链接

9.5.1　普通框架结构的链接

9.5.2　浮动框架的链接

9.6　练习题

第10章　使用表单

10.1　表单标记form

10.1.1　提交表单action

10.1.2　表单名称name

10.1.3　传送方法method

10.1.4　编码方式enctype

10.1.5　目标显示方式target

10.2　插入表单对象

10.2.1　文字字段text

10.2.2　密码域password

10.2.3　单选按钮radio

10.2.4　复选框checkbox

10.2.5　普通按钮button

10.2.6　提交按钮submit

10.2.7　重置按钮reset

10.2.8　图像域image

10.2.9　隐藏域hidden

10.2.10　文件域file

10.3　菜单和列表

10.3.1　下拉菜单

10.3.2　列表项

10.4　文本域标记textarea

10.5　id标记

10.6　创建表单实例

10.7　练习题

第11章　使用XHTML

11.1　XHTML简介

11.1.1　什么是XHTML

11.1.2　为什么要升级到XHTML

11.2　XHTML页面结构

11.2.1　文档类型声明

11.2.2　元素和名字空间

11.2.3　网页头部元素

11.2.4　页面标题元素

11.2.5　页面主体元素

11.3　XHTML语法规范

11.3.1　XHTML元素必须是完全嵌套的

11.3.2　XHTML文档格式必须规范

11.3.3　标签名必须是小写的

11.3.4　所有的XHTML元素都必须有始有终

11.3.5　用id属性代替name属性

11.3.6　DOCTYPE声明是不可缺少的

11.3.7　属性必须加上英文双引号

11.3.8　明确所有属性的值

11.4　在Dreamweaver中编辑XHTML文件

11.5　将现有的HTML网站转换成XHTML

11.6　练习题

第12章　使用CSS样式表

12.1　认识CSS

12.2　使用CSS

12.2.1　CSS的基本语法

12.2.2　添加CSS的方法

12.3　字体属性

12.3.1　字体font-family

12.3.2　字号font-size

12.3.3　字体风格font-style

12.3.4　加粗字体font-weight

12.3.5　小写字母转为大写font-variant

12.3.6　字体复合属性

12.4　颜色和背景属性

12.4.1　颜色属性color

12.4.2　背景颜色background-color

12.4.3　背景图像background-image

12.4.4　背景重复background-repeat

12.4.5　背景附件background-attachment

12.4.6　背景位置background-position

12.4.7　背景复合属性background

12.5　段落属性

12.5.1　单词间隔word-spacing

12.5.2　字符间隔letter-spacing

12.5.3　文字修饰text-decoration

12.5.4　垂直对齐方式vertical-align

12.5.5　文本转换text-transform

12.5.6　水平对齐方式text-align

12.5.7　文本缩进text-indent

12.5.8　文本行高line-height

12.5.9　处理空白white-space

12.5.10　文本反排unicode-bidi、direction

12.6　外边距与内边距属性

12.6.1　上边距margin-top

12.6.2　其他边距margin-bottom、margin-left、margin-right

12.6.3　外边距复合属性margin

12.6.4　顶端内边距padding-top

12.6.5　其他内边距padding-bottom、padding-right、padding-left

12.6.6　内边距复合属性padding

12.7　边框属性

12.7.1　边框样式border-style

12.7.2　边框宽度border-width

12.7.3　边框颜色border-color

12.7.4　边框属性border

12.8　定位属性

12.8.1　定位方式position

12.8.2　元素位置top、right、bottom、left

12.8.3　层叠顺序z-index

12.8.4　浮动属性float

12.8.5　清除属性clear

12.8.6　可视区域clip

12.8.7　层的宽度和高度width、height

12.8.8　超出范围overflow

12.8.9　可见属性visibility

12.9　列表属性

12.9.1　列表符号list-style-type

12.9.2　图像符号list-style-image

12.9.3　列表缩进list-style-position

12.9.4　列表复合属性list-style

12.10　光标属性cursor

12.11　滤镜属性

12.11.1　不透明度alpha

12.11.2　动感模糊blur

12.11.3　对颜色进行透明处理chroma

12.11.4　阴影效果dropShadow

12.11.5　对象翻转flipH、flipV

12.11.6　发光效果glow

12.11.7　灰度处理gray

12.11.8　反相invert

12.11.9　X光片效果xray

12.11.10　遮罩效果mask

12.11.11　波形滤镜wave

12.12　练习题

第13章　Web标准与CSS网页布局实例

13.1　Web标准与CSS布局

13.1.1　什么是Web标准

13.1.2　CSS布局的优势

13.2　DIV+CSS布局网页基础

13.2.1　认识DIV

13.2.2　一列固定宽度

13.2.3　一列自适应

13.2.4　两列固定宽度

13.2.5　两列宽度自适应

13.2.6　两列右列宽度自适应

13.3　使用CSS设计网站导航栏

13.3.1　实现背景变换的导航菜单

13.3.2　利用CSS制作横向导航

13.4　使用CSS设计表单样式

13.4.1　改变按钮的背景颜色和文字颜色

13.4.2　设计文本框的样式

13.4.3　设计文本框中的文字样式

13.5　字体及段落样式设计

13.5.1　利用CSS控制字体大小和行距

13.5.2　制作光晕文字效果

13.6　使用CSS设计图片样式

13.6.1　鼠标指针移上时图片渐变的效果

13.6.2　设计不重复出现的背景

13.7　使用CSS控制链接样式

13.7.1　使用CSS实现鼠标指针形状改变

13.7.2　鼠标指针移到链接文字上时改变文字大小或颜色

13.8　练习题

第14章　JavaScript脚本基础

14.1　JavaScript简介

14.2　JavaScript基本语法

14.2.1　常量和变量

14.2.2　表达式和运算符

14.2.3　基本语句

14.2.4　函数

14.3　JavaScript的事件

14.3.1　onClick事件

14.3.2　onchange事件

14.3.3　onSelect事件

14.3.4　onFocus事件

14.3.5　onLoad事件

14.3.6　onUnload事件

14.3.7　onBlur事件

14.3.8　onMouseOver事件

14.3.9　onMouseOut事件

14.3.10　onDblClick事件

14.3.11　其他常用事件

14.4　浏览器的内部对象

14.4.1　navigator对象

14.4.2　document对象

14.4.3　windows对象

14.4.4　location对象

14.4.5　history对象

14.5　练习题

第15章　利用JavaScript制作网页特效

15.1　时间特效

15.1.1　显示当前时间

15.1.2　显示当前日期

15.1.3　显示网页停留时间

15.1.4　制作倒计时特效

15.2　图像特效

15.2.1　当鼠标指针经过图像时图像震动效果

15.2.2　图片闪烁效果

15.2.3　自动切换图像

15.3　窗口特效

15.3.1　全屏显示窗口

15.3.2　定时关闭窗口

15.4　鼠标特效

15.4.1　禁止鼠标右击

15.4.2　跟随鼠标指针移动的图像

15.4.3　跟随鼠标指针的滚动字幕

15.5　其他特效

15.5.1　设置为首页和加入收藏夹

15.5.2　浏览器状态栏显示信息

15.5.3　进入网站的口令设置

15.6　练习题

第16章　在Dreamweaver中编辑HTML网页

16.1　Dreamweaver的基本操作界面

16.2　在网页中使用文本

16.2.1　插入文本

16.2.2　设置文本属性

16.2.3　插入特殊字符

16.2.4　插入水平线

16.3　插入图像

16.3.1　在网页中插入图像

16.3.2　设置图像属性

16.3.3　使用图像编辑器

16.3.4　插入鼠标经过图像

16.4　插入多媒体

16.4.1　插入Flash

16.4.2　打开浏览器窗口

16.4.3　插入Java Applet

16.5　设置链接

16.5.1　创建文字链接

16.5.2　创建图像链接

16.5.3　创建锚点链接

16.6　布局网页

16.6.1　使用表格

16.6.2　使用DIV

16.7　使用表单

16.7.1　插入表单

16.7.2　插入文本域

16.7.3　插入单选按钮和复选框

16.7.4　插入菜单和列表

16.7.5　插入跳转菜单

16.7.6　插入按钮

16.8　使用CSS样式表

16.8.1　CSS的基本概念

16.8.2　建立标签样式

16.8.3　建立类样式

16.8.4　建立复合内容样式

16.8.5　应用CSS固定字体大小

16.9　使用行为

16.9.1　行为的基本知识

16.9.2　使用行为制作特效

16.10　在网页中添加脚本

16.11　练习题

第17章　个人博客网站布局

17.1　博客网站概述

17.2　博客网站主页布局设计

17.3　博客网站主页具体制作过程

17.3.1　导入外部CSS

17.3.2　制作网页头部分

17.3.3　制作页面内容部分

17.3.4　制作页面页脚部分

17.4　练习题

第18章　公司宣传网站的布局

18.1　企业网站设计分析

18.1.1　企业网站内容设计

18.1.2　排版构架

18.2　各部分设计

18.2.1　Logo与顶部导航

18.2.2　左侧导航

18.2.3　主体内容

18.2.4　制作搜索部分

18.2.5　制作公司新闻

18.2.6　制作联系我们

18.2.7　底部版权信息

18.3　练习题

附录A　HTML网页制作技巧精讲

技巧1　制作带背景音乐的网页

技巧2　设置每隔一定的时间自动刷新网页

技巧3　提高站点在搜索引擎中被搜索到的机会

技巧4　让站点自动跳转到另一页

技巧5　避免自己的图片被其他站点利用

技巧6　不用表格而准确地分隔图片和文字

技巧7　跳到页面的顶部

技巧8　在一个站点的不同页面播放同一个声音文件

技巧9　清除页面中的框架结构

技巧10　防止站点页面被任意链接

技巧11　为文字链接加上提示

技巧12　删除图片链接的蓝色边框

技巧13　让浏览器正确显示word格式文件

技巧14　利用水平线制作垂直线

技巧15　正确选择JPG和GIF图片格式

技巧16　正确使用分隔线

技巧17　去除页面四周的空白

技巧18　去除浏览器的滚动条

附录B　CSS常用技巧精讲

技巧1　去掉网页超链接的下画线

技巧2　设置浮动背景

技巧3　正确对齐文本

技巧4　超链接访问过后防止hover样式出现问题

技巧5　解决list-style-image无法准确定位的问题

技巧6　让文本垂直居中

技巧7　使一个层垂直居中于浏览器

技巧8　给部分内容加上边框

技巧9　利用CSS去掉下画线

技巧10　让div横向排列

技巧11　巧妙设置滚动条颜色

附录C　JavaScript特效制作精讲

技巧1　添加链接提示

技巧2　在网页中加入最后修改日期

技巧3　实现图片循环隐现的效果

技巧4　给图像添加探照灯效果

技巧5　打开一个新的浏览器窗口并设置窗口的属性

技巧6　利用单击来关闭浏览器窗口

技巧7　禁止保存网页

技巧8　制作网页中雪花飘飘效果

技巧9　在状态栏中显示跑马灯效果

技巧10　制作烟花效果

技巧11　制作状态栏数字时钟

技巧12　制作围绕鼠标指针旋转的文本

技巧13　制作跟随鼠标指针飘动的双层时钟

技巧14　实现每天不同时间显示不同信息

技巧15　禁止鼠标右键和左键对页面的操作

技巧16　实现鼠标指针移上时图片加亮的效果

技巧17　让网页中跳出一个会说话的老人

技巧18　让浏览者知道自己访问网页的次数

技巧19　禁止页面最小化

技巧20　设置网页由中间向外扩大变化

附录D　Dreamweaver常用技巧精讲

技巧1　在Dreamweaver中插入空格

技巧2　在Dreamweaver中设置Flash动画的背景透明

技巧3　在Dreamweaver中准确定位层

技巧4　把别人网页上的背景音乐保存下来

技巧5　使网页在不同分辨率下都全屏铺开

技巧6　在Dreamweaver中给水平线加颜色

技巧7　在网页中实现Flash的全屏播放

技巧8　怎么样让在800×600分辨率下生成的网页在1024×768分辨率下居中显示

技巧9　清除网页中不必要的HTML代码

技巧10　在网页中添加E-mail链接并显示预定的主题

技巧11　在网页中添加电子邮件表单提交

技巧12　防止别人把自己的网页放在框架里

技巧13　巧妙实现两个表格的并排