网页制作基础知识-系陌题.pptVIP

第一章 网页制作基础知识;1.1 案例 网页制作学习园地网页;1.1案例：网页制作学习园地网页; 1.1.1 功能要求1．整个网站主要以HTML代码编写的方式完成。页面风格以简单、清晰为 主，网页基本元素由文本和图像组成；2．在主页中，访问者可以获得网站中的主题信息和学习内容列表。点击链 接文本，可以打开介绍相关知识点的页面；3．在页面中设置电子邮件链接，如“联系我们”，提供一个与用户互交的平台；4．为网页设置背景音乐和欢迎字幕。打开网页，有声音传出。当鼠标指针移动到滚动的欢迎字幕上时，文字停止滚动，移下鼠标后继续；5．点击页面中的链接字，在新的浏览器窗口打开一个由上框架、左框架和主框架构成的框架网页。 1.1.2 详细设计网页设计的步骤如下：1．网页总体规划 首先考虑和设计网页的框架结构和艺术风格。可以先画出网站的草图，确定网站中各网页之间的链接关系，这样在创建每个网页时都会有清晰的思路，以免迷失方向，而且以后需要进行重组的可能性较小。; “网页制作学习园地”网站的链接结构如下图： 在本地计算机的硬盘中建一个名为“mysite”的文件夹（此文件夹为空）做为站点，即网站根目录。在制作的过程中将所有创建和编辑的文档，以及用到的网页素材都保存在该文件夹中。 本案例中共需要创建三个网页，“index.htm”为网站首页，单击页面中的超链接：“第一章 网页制作基础知识”，在新的浏览器窗口中打开一个框架网页，此框架网页的文件名为“Frameset.htm”。框架网页中包括上框架（链接网页是topframe.htm）、左框架（链接网页是leftframe.htm）和主框架（链接网页是mainframe.htm）。单击左框架中的超链接：“HTML主要标记”，在主框架中打开介绍HTML文档结构标记的网页“html_tag.htm”。; 在组织站点结构时，应注意以下几个问题： ① 归类站点资源 在同一个文件夹中放置相关的网页，并在需要的时候使用子文件夹。这样的组织方式可以使网站层次清晰，更容易更新、维护。 ② 确定网页素材存放的位置 站点中通常包含图像、声音、动画等多种素材，为了更好的存储资源，一般应在站点根目录下创建多个子文件夹，将用到的网页素材分门别类地存储到相应的文件夹下。必要时，可以创建多级子文件夹。 本案例中将站点命名为“mysite”，根据网站的实际需要，其中建立了“HTML”、“image”、“sound”、“style”四个文件夹，分别用来放置网页、图像、声音和样式表文件。 ③ 网页及网页元素的命名 为页面、图像和其他外部文件设计一个简单且一致的命名系统。根据一般原则，主页命名为“index.htm”，其他页面及相关的网页元素能望名知意。很多Internet服务器使用的是英文操作系统，不能对中文文件名提供很好的支持，故在构建的站点中，建议全部使用英文字母组成文件名。; 2．网页的主题定位 确定为什么要创建这个网页及希望展示的内容。创建此页面的目的是让访问者一打开网页就能发掘学习的内容，同时显示友好的标语欢迎访问者。 3．图片、声音等媒体文件的使用 要让网页更加美观，更具人性化，可在网页中适当添加图片、动画、音/视频等多媒体文件。为了保证网页的传输速度，选择网络上常见的媒体格式，并将它们放置在相应的文件夹中。 4．制作工具的选择 可使用FrontPage、DreamWeaver等网页制作软件。在本案例中，将使用DreamWeaver MX进行“网页制作学习园地”网站的创建。;1.2 理论知识;2．HTML标记的表示; HTML结构包括头部（Head）、主体（Body）两大部分。头部放置文档标题，也可以指明浏览器在显示文档时可能会用到的其他参数；主体放置文档的实际内容，包括要显示的文本和文档的控制标记（标签），这些标记将告诉浏览器该如何显示文本。标签还可以引用特殊效果的文件，包括图像、图形、声音和动画，并指出将文档链接到其他文档的热点。 ;1.2.1.1 HTML文档结构标记;meta标记;body标记;1.2.1.2 文