下载文档原格式
A、超链接<a>标签<a></a>是对标签，里面必须有属性<a href=“…”></a>，href的全称是h yptertext ref erence（超文本索引），其值可以是网页文件（.html）、图片（.jpeg, .gif, .png）、多媒体（.mp3, .mp4）、可携带文档格式（.pdf）以及一些其他类型的文档（.doc, .ppt, .xls, .rar, .zip等），前面网页文件、图片、多媒体与可携带文档都可以在浏览器中直接打开，后面的其他文档则会通过下载文件的形式下载下来。
B、用<a>标签来做“锚记链接”的步骤：1、首先你需要有一个“导航”，导航我们一般用列表标签来做，对里面的列表添加a标签，不同的是这个a标签的href里是#和一个名字，#是当前页面的意思，也就是定位到当前页面的某个位置，比如说：<ul><a href=“#1”><li>…</li></a><li>…</li><li>…</li></ul>2、定义一个超链接的位置，作为空位置可以用p标签或者其他常用标签来代替，该超链接需要添加一个name属性，比如说：（这里不需要#咯）<a name=“1> <p></p>这样就实现了按ul中的a标签，页面自动定义到网页中某个位置的作用。
C、音频与视频标签这两个都是对标签，音频audio，视频video，常用属性有src（source来源）, autoplay（自动播放）, controls（控件）, loop（循环播放），一般写作：<audio src=“…”controls=“controls”autoplay=“autoplay”loop=“loop”></audio>这里只有src是必须的，其他都可以去掉，根据自己需要来写，例如不要显示控件就把controls=“controls”去掉。
第1章HTML基础HTML(超文本标记语言)是制作网页的基础。
HTML标记是HTML的核心与基础，用于修饰、设置HTML文件的内容及格式。
一个HTML文件中包含了所有将显示在网页上的文字信息。
其中也包括对浏览器的一些指示，如文字应放置在何处，显示模式如何等。
如果还有一些图片、动画、声音或是任何其他形式的资源，HTML文件也会告诉浏览器到哪里去查找它们，以及它们将放置在网页中的什么位置。
教学目标通过对本章的学习，读者应了解和掌握HTML的各种标记和语法，并能够使用HTML 设计简单的静态网页。
教学重点与难点●使用HTML设计静态网页●编辑网页文本格式●创建超链接●使用表格●使用列表1.1 网页基础知识Internet是从Interconnected Networks延伸而来的，是跨国界的网络。
Internet把世界各地数以千万计的计算机和传输线路连接在一起构成一个网络。
通过它可以交换信息、共享资源，并以此为基础实现各种计算机通信应用项目。
在Internet中，网页是它的重要组成部分，本节首先介绍一些与网页相关的名词和概念。
1.1.1 万维网——WWWWWW(World Wide Web)即环球信息网，也可以称为Web，中文名字为“万维网”。
用户在使用浏览器来访问Web的过程中，无须关心一些技术性的细节即可得到丰富的信息资料。
WWW 是Internet上发展最快和目前使用最广泛的一种服务。
ASP动态网站开发教程• 2 •简单的说，WWW是漫游Internet网的工具，它把Internet上不同地点的相关信息聚集起来，通过WWW浏览器(比如IE，Internet Explorer)检索，无论用户所需的信息在什么地方，只要浏览器为用户检索到之后，就可以将这些信息(文字、图片、动画、声音等)“提取”到用户的计算机屏幕上。
1.1.2 超文本传输协议——HTTPHTTP(HyperText Transfer Protocol)即超文本传输协议，它是WWW服务器上使用的最主要协议。
实训一站点的资源管理【实训目标】1、掌握站点的创建方法2、掌握站点的上传方法3、掌握空间站点的管理方法【实训内容】1、站点的创建、2、申请网上个人主页空间3、上传、下载站点4、个人空间管理实训二HTML基础与文本格式【实训目标】1、了解HTML的作用及其写法和规则2、掌握常见的HTML语句3、会在代码窗口编写简单的html语句，并输出生成页面【实训内容】用记事本或者是通过Dreamweaver代码窗口编写代码完成以下实训：1．用HTML编写一个简单的基本页面2．创建一个使用图像作为背景图案的网页3．创建一个页面，对文本进行设置4. 插入背景音乐实验三表格与超链接【实训目标】1、会利用表格对网页进行布局2、理解和掌握超链接的含义3、掌握几种超链接的创建方法4、掌握热区的创建和使用方法【实训内容】运用表格的嵌套等技术对所给的图片和文字进行定位。
创建网页文本链接；创建网页图片链接；创建电子邮件链接；创建脚本链接；创建锚点链接；给链接添加提示及管理链接。
实训四表单【实训目标】1、掌握表单项目的创建方法【实训内容】1、制作一个用户注册页面实训五框架【实训目标】会利用框架网页进行布局掌握框架网页的创建方法；掌握保存方法；掌握框架网页的编辑方法。
【实训内容】1、制作一个框架集网页，要求整个框架集包含3个页面2、制作一个能在页面内指定位置打开网页的页面实训六层与行为【实训目标】1、掌握插入层与绘制层的方法3、掌握层与行为特效的使用方法【实训内容】1、绘制层2、利用行为特效控制层的显示与隐藏效果实训七Fireworks 实例制作【实训目标】1、熟练认识与掌握fireworks矢量工具的使用2、掌握矢量图形与位图的区别3、理解和掌握路径与填充的特点4、掌握路径组合的特点和方式【实训内容】1、十字梅花按钮效果2、文字曲线动画3、Loading实例制作4、冬之韵逐字动画《网页设计》综合作业一、实训目的1.了解各类网站的制作方法。
实验一网页的认识实验目的1、掌握利用Internet进行信息游览、搜索，下载网页、图片、文字和文件；2、利用记事本来编辑HTML文档并浏览；3、熟悉HTML基本标记的使用。
实验环境WindowsXP操作系统，内部组成局域网，外连Internet互联网。
实验重点及难点◆熟悉HTML的结构、语法。
◆熟悉HTML基本标记的使用。
实验内容1、从网上（如网页制作大宝库等）下载网页制作时需要的小图片、动画及flash等网页制作素材。
2、收集你认为比较好的网页并从网页主题、网页内容、结构布局、色彩搭配等方面来分析网页。
3、通过浏览新浪网站主页分析其网页基本元素，查看其源代码，收藏到收藏夹中，将其设为主页。
4、制作一个简单的网页sy1-1.html，用记事本编辑，网页标题为“熟悉HTML文档的结构”，内容为司空曙的《江村即事》，如下图所示。
5、通过附录1的练习熟悉HTML基本标记的使用。
（可参考第二章内容）实验二 Dreamweaver基本操作（一）实验目的1、熟悉Dreamweaver的工作环境并了解本地站点的建设和管理；2、熟悉网页文件的基本操作；3、熟练掌握在网页文件中文本、图像、超链接的添加和设置。
实验环境WindowsXP操作系统，Dreamweaver CS3软件，内部组成局域网，外连Internet互联网。
实验重点及难点◆文字的插入及设置。
◆图像的插入及设置。
◆各种超链接的创建。
实验内容1、使用Dreamweaver建立一个本地站点并命名为“Dreamweaver基本操作”，包含以下几个文件和文件夹：图片文件夹（images）；音乐文件夹（sound）等。
2、在站点“Dreamweaver基本操作”中新建一个名为sy2-1.html的网页文件，从提供的网页原始素材中把相关文字复制到该网页文件中，并进行适当的文字设置，结果如下图所示。
3、在站点“Dreamweaver基本操作”中对网页sy2-1.html按如下要求进行编辑并另存为sy2-2.html，效果如图所示。
网页基本知识内容！一、网页设计基础（一）什么是主页？Internet快速发展，网民人数激增，能在网上拥有自己的主页是网民的心愿。
在网络中有一种配置较高，24小时开机的计算机，之间连接在internet上的服务器。
利用浏览器，通过internet可以直接查看硬盘（服务器）上的文件，这就是我们讲的网页。
很多网页合起来就构成了主页。
（二）主页空间及免费服务要做主页首先要在internet上找一个服务器空间放置主页。
大的网站可以给你提供30M至100 M的免费主页空间让你使用。
因为是免费的，服务功能少一些。
你要享受更好的服务，可以申请虚拟主机，但这是要收费的。
申请到主页空间后，会得到一个域名，就是你的主页地址，在浏览器地址栏输入这个网址就可以浏览你的主页了。
如果网址名太长不好记，还可以申请一个新的域名。
域名有免费和收费两种，免费的域名，注册一下就可以了；收费的域名要到指定的机构办理手续。
国外域名可以自由申请，一个域名一年约十几元钱。
在internet上还有免费的计数器和聊天室，都可以用到你的网页中去。
（三）网页实际是文本文件网页是用文本文件组成的，扩展名是htm或html。
最初用html（超文本标记语言），现在扩展为有HTML、CSS、JAVAｓｃｒｉｐｔ组成的DHRML，就是常说的“动态网页”。
网页是纯文本文件，可以用文本编辑软件来编辑，记事本是最简单的网页编辑工具了，但功能太简单。
Ultraedit是具有很强功能的文本编辑软件，专为网页编辑提供了很强的功能。
（四）所见即所得的网页制作工具用文本编辑软件做网页必须会HTML语言，所见即所得的网页制作工具，和WORD排版差不多，你只要将文本、图形摆到网页中，网页会自动生成HTML代码。
Frontpage是微软公司出品的网页制作工具，和WORD、IE结合得非常好，简单易用、易上手，是初学者比较好的选择，但兼容性差一些，制作的网页不支持Netscape等其他浏览器，对复杂的动态网页的设计能力有限。
第1章习题参考答案一、思考题1．答：因特网：即Internet，通常称为互联网或国际互联网。
ISP：因特网服务提供者。
ICP：因特网内容提供者。
WWW：World Wide Web的简称，有时也简称为Web，对应的中文名称为万维网，是因特网提供的一种服务。
IP地址：在因特网中，每一台主机都必须有一个IP地址。
IP地址由4个字节（32位二进制数）组成。
域名：用文字描述来代替IP地址，解决IP地址难以记忆的问题。
URL：统一资源定位器，是表示Internet上信息资源地址的统一格式。
超文本：是指包含指向其他Web页的超连接（Hyper link）文本格式。
超链接是指内嵌了Web地址（即网页的URL）的文字或图形。
网页：网页（Web Page）也称为Web页面，通常是使用HTML语言编写成的。
一个Web页面对应一个HTML文件，也可能还包括与该HTML文件相关的若干个图片文件、其他多媒体文件和脚本文件等。
网站：网站（Web Site）是由Web服务器上的一组相关的网页文件组成的，这些网页文件存放在Web服务器的一个或若干个指定的目录内。
主页：主页（HomePage）是网站中的一个特殊页面，是用户连接到网站时默认显示的第一个网页，即用户连接到网站时首先看到的页面。
2．答：从网页制作技术的角度来说，主页与其他网页没有什么本质的不同。
但在网站中，主页的文件名通常是固定的，例如index.htm或default.htm等，是在Web服务器软件中设臵的。
3．答：包括超文本标记语言（HTML）、层叠样式表（CSS）、脚本语言（JavaScript）、动态HTML（DHTML）、动态网页技术（ASP、PHP、JSP等）、可扩展标记语言（XML）等。
XML并不是被开发出来取代HTML的，而是用以弥补其不足的。
4．答：通常动态网页指得是，Web服务器能够通过HTML表单收集用户的信息，用户也可以通过网页获得自己想要的信息，一般采用数据库技术，实现网页的界面和内容的分离，并使得网站内容的更新和维护非常方便。
第2章文本格式与超链接
（1）段落格式
本章目标
•掌握段落标记符p、断行标记符br、标题标记符h1~h6、水平线标记符hr的用法。
•理解物理字符样式和逻辑字符样式。
•掌握使用ol/ul 和 li 标记符创建列表。
•掌握使用 a 标记符创建页面链接和锚点链接。
段落格式
•段落格式是指针对 HTML 文档中的段落所设置的格式，例如段落的对齐方式。
•还有哪些段落格式？
•首行缩进是不是段落格式？段间距呢？
分段标记符
•分段标记符用于将文档划分为段落，标记为<p></p>。
•换行标记符用于在文档中强制断行，标记为一个单独的<br />。
标题样式
•hn 标记符 = 各级标题
•n 是1至6的数字；h1表示最大的标题，h6表示最小的标题。
•注意：使用标题时应按照其逻辑含义，而不是按照其显示效果！
添加水平线
•添加水平线的标记符为hr，它包括以下属性：–size （粗细）
–width （长度）
–noshade （实线）
align 属性
•align 属性用于设置段落的对齐格式，取值：right（右对齐）、left（左对齐）、center（居中对齐）和 justify（两端对齐）。
•align 属性可应用于多种标记符，例如p、hn（标题标记符）、hr 等。
•注意：在学习了CSS技术之后应避免使用align属性。
第2章文本格式与超链接（2）字体格式与列表
字体格式
•字体格式/字符格式是指针对段落中的部分文字所设置的格式，通常包括：字体样式、字号、文字颜色等。
•注意：字体格式属于显示效果的设置，因此应主要使用CSS技术来实现。
物理字符样式
•物理字符样式是指标记符本身说明了所修饰的效果。
•常用物理字符样式标记符有：–黑体标记<b></b>
–斜体标记<i></i>
–下划线标记<u></u>
逻辑字符样式
•逻辑字符样式是指标记符本身说明了所修饰效果的逻辑含义，例如address标记符。
•常用逻辑字符样式：
–<strong></strong>
–<em></em>
–<code></code>
•有序列表是一种在表的各项前显示有数字或字母的缩排列表，表示一种顺序的关系。
•定义有序列表的语法如下：
<ol type=”1|A|a|I|i”>
<li>List item 1</li>
<li>List item 2</li>
</ol>
•属性type用来设置数字序列样式，取值为：1、A、a、I、i。
•无序列表是一种在表的各项前显示有特殊项目符号的缩排列表，表示并列关系。
•定义无序列表的语法如下：
<ul type=”disc|circle|square”>
<li>List item 1</li>
<li>List item 2</li>
</ul>
文本元素总结
块元素
•h#
•p
•pre •address •blockquote 行内元素•em •strong •sub
•sup
换行
•br 通用元素•div •span
列表•ul
•ol
•li
展示元素•b
•i
•u •small •hr
核心文档结构元素
•h1~h3
•p
•ul, ol, li
谢谢！
第2章文本格式与超链接
（3）超链接
超链接基础
• URL（Universal Resources Locator）用于定位Web上的文档信息。
•一个 URL 包括 3 部分：协议、计算机地址、文件路径。
•协议：//计算机/文件路径
超链接基础——绝对URL
•绝对URL是指资源的完整地址，包括所有3个部分，即：•协议：//计算机/文档名
•相对URL是指Internet上资源相对于当前页面的地址，它包含从当前页面指向目标页面位置的路径。
•使用相对URL的好处：易于维护
•使用相对URL时，经常使用两个与DOS类似的符号：–句点（.）表示当前目录
–双重句点（..）表示当前目录的上一级目录
•根据超链接的目标文件不同，分为：–网页之间的超链接
–页面内的超链接
–文件下载超链接
–Email超链接
–空超链接
•根据超链接源对象的不同，分为：–文本超链接
–图像超链接（包括图像映射）
–对象超链接（例如Flash、Java小程序）•根据超链接实现方式的不同，分为：–HTML超链接
–JavaScript超链接
–对象超链接
创建超链接
• a 标记符用于创建超链接，href 属性用于指定超链接的目标文件。
•内部网页超链接：<a href=wow.htm> 关于魔兽世界</a>
•外部网页超链接：
•使用页面内的超链接，首先需要定义锚点，然后在超链接中指向该锚点。
定义锚点应使用<a name=xxx></a>•指向锚点的超链接为：<a href=#锚点名称>link</a>
•指向其他页面内锚点的超链接：<a href = 页面的URL#该文件中的锚点>link</a>
•<a href= # >blank link</a>
•<a href="图2-5.htm#yyjb">夜雨寄北</a>
创建超链接——文件下载
•当超链接目标为浏览器不能识别的文件格式时，那么就自动生成了文件下载链接。
•<a href=xxx.zip>下载</a>
创建超链接——Email链接
•<a href=mailto:i@>Email</a>•控制命令：
–?subject= 设置信件主题
–?cc= 设置抄送人
–?bcc= 设置密件抄送人
–& 组合多个控制命令
谢谢！
第2章文本格式与超链接
（4）综合实例
站点目录设计
谢谢！。
