网页制作基础教程

第一章网页制作基础

1、什么是网页

一般浏览器中打开的都是网页，这些文档是通过超文本标记语言HTML表示出来的；

主页：在网站中默认打开的页面称为主页，也叫首页，主页是进入网站的门户，

网页中包括的内容：

文本，图像，超级链接，表格，表单，多媒体及一些特殊的效果

2、网站及运作原理

网站是在互联网上一个固定的面向全世界发布消息的地方，它由网站地址和网站空间构成；

网站开发者常常将网站称作为站点，在网站的开发者来说，网站就是在计算机上创建的一个多级的文件夹，并在各文件夹中保存着相关网页文件。

根据站点文件夹所在的位置分为：本地站点和远程站点；

根据服务技术分：静态网站和动态网站

3、了解HTML语言

HTML是网上用于编写网页的主要语言，使用HTML语言编写的网页文件也是一个标准的纯文本文件，可以使用文本编辑器将它打开，但是该纯文本文件如果使用浏览器打开就会看到排版整齐的网页；

4、HTML语言标签

HTML标签用来标记网页元素，以形成文本布局，文字的格式及五彩缤纷的画面，HTML 的标签分单标签和成对标签两种

基础标签：

5、常用动态建站技术

ASP是由微软开发的动态网页技术标准，其原理通过在HTML页面中加入VB JA V A代码，服务器在返回网页之前首先执行这些代码，产生最终的结果。

6、网站的制作流程及制作工具

初期规划：建站之前，要有明确目的，要明白建立网站的目的，接受对象是哪些群体，要为访问者提供怎样的服务，然后对整个网站进行策划，

中期制作：搭建本地站点，建立文件夹，建立站点结构图，设置页面属性等；

后期工作：全面测试，上传后进行实地测试，完成本地测试后，再上传到服务器，以便进行远程测试；

7、网页设计工具

Dreamweaver 8 是最常用的网页编辑工具之一，使用该工具可以在其提供的三种视图中进行

网页编辑与修改；

图像处理工具Firework 8主要用来对网页中用到的图像素材进行制作或处理，它可以快速地制作和处理网页中图像，

动画制作工具：FLASH 8 主要用来制作一些精彩的小动画，可以使页面变得更加精美，该软件是目前最流行的，矢量的，具有交互性的图形编辑软件；

第二课创建站点

1、启动：开始——程序——Macromedia dreamweaver 8（双击桌面的图标）

2、关闭：文件——退出，关闭按钮

3、窗口的组成：标题栏（软件名称，版本号，文件名，最小化，最大化，关闭按钮）

菜单栏：由文件，编辑，查看，插入，修改，文本，站点，窗口等主菜单组成；

插入栏：位于菜单栏下方，有网页制作时常用的元素及命令，如常用，布局等

开始页：打开软件时的页面，该页面位于屏幕中间的大部分区域；

属性面板：一般位于窗口的底部，显示文档，网页元素及相关工具的属性；

面板集：位于窗口右侧，可以快速展开或折叠一些功能面板，

4、创建站点：站点——新建站点——站点名称——否（不用服务器）——建立一个本地文件夹——如何连接远程服务器（无）——完成；

5、编辑站点，复制站点，删除站点，导出站点，导入站点，完成按钮；

6、管理站点中的文件：站点的名称，远程文件管理器，站点文件结构——弹出菜单——视图菜单

8、文档的新建，保存，打开及属性设置

9、设置页面属性：修改——页面属性（页面字体，大小，文本颜色，背景颜色，背景图像，

页边距，跟踪图像）

第三课：制作网页

1、在网页中插入文本（直接输入文本即可）（换行：ENTER，按SHIFT+ENTER可得到较小的行距；

2、设置字体，大小，字形，颜色，对齐方式

3、在网页中插入图像：插入——图像（图像的大小，对齐方式，边距等设置）

4、插入——层（在层中插入图像，可将图像到处拖动）

5、在网页中插入鼠标经过图像：插入——图像对象——鼠标经过图像（原始图像，鼠标经

过时的图像）

6、插入特殊的符号，版权，注册商标等；插入——文本——版权，注册商标，符号等

7、插入多媒体文件；插入——媒体——FLASH（选择插入的文件）

8、设置动画的大小及其边距（属性面板：宽，高，垂直，水平的间距）

9、插入——布局对象——层（设置背景图像，大小，方向等设置）

10．向网页中插入链接：选择文本——在图像中选择链接的文件；

11．创建外部链接：在文档中输入网名，选择名称：引用链接网址

12．创建锚记：先命名锚记——然后再选择要引用锚记的文字，然后进行链接OK（引用时加#）

13．在网页中插入视频：插入——媒体——插件（选择视频文件

14．创建邮件链接：选择图像——链接邮箱地址

15．创建下载链接：选择文本或图像——链接文件（ZIP RAR EXE）等文件

第四课页面布局

1、插入——表格（行数，列数）

2．表格的宽度，

3．边框粗细；

4．单元格边距；

5．单元格间距；

6．合并所选单元格，拆分单元格，背景，背景颜色，边框；

7．表格布局；插入——表格（在单元格内插入表格（做嵌套表格）

8．改变列宽，行高

9．网页的布局：插入——布局对象——层（可以创建多个层，如同文本框的设置）

10．设置层的属性：宽度，高度，单击插入图像的层选择手柄，在属性面板中

11．布局网页框架：创建布局表格，创建布局单元格，做嵌套布局表格；

12．将布局转换成表格：修改——转换——表格到层（防止层重叠，显示层面板，显示靠齐到网格）

13．框架布局与样式定义：插入——框架（选择框架布局形式）

14．制作背景固定网页：定义样式

第五课CSS样式与行为

1、光晕效果的应用CSS面板——添加滤镱设置（名称，（GLOW（color=?,strength=?）

设置(color=red,strength=3)

2、添加行为：行为面板（添加行为，删除行为，执行顺序）

3．设置触发行为的事件：事件，动作

4．记录移动路径

5、添加时间轴行为：

6、制作表单元素；

第六课，表单与模板、

1、制作注册页面

2、创建网站模板；

3、将网页保存为模板：文件——另存为模板

4、创建可编辑区域：插入——模板对象——可编辑区域；

5、网页模板的应用，打开后修改——然后另存为其它网页文件；

6、分离模板：修改——模板——套用模板到页（修改——模板——从模板中分离）

第七课：FLASH的操作

1、启动：双击桌面图标，

2、退出：关闭按钮；