网页设计与应用

.网页设计与应用专业：计算机网络技术班级：2015学号：20150321031姓名：蔡依婷指导教师：杨艳慈邯郸职业技术学院2017年11月21日2摘要网页设计与应用摘要本论文将对个人网页设计与制作的方法、工具等展开研究和探讨。

在介绍网页设计与制作语言的基础上，着重使用JavaScript作为工具语言进行网页设计与制作的实际操作，分别对基于对象的JavaScript语言、内部对象系统的使用及WEB页面信息交互——窗口和框架进行详细描述，并利用具体的实例进行验证。

本论文主要章节如下，第一章：绪论，本章主要介绍网页设计的相关知识。

第二章：网页设计语言概述，本章主要介绍网页设计的语言——HTML，以及用于编辑HTML语言的软件，为后续工作奠定基础。

第三章：基于对象的JavaScript语言，本章介绍了基于对象的JavaScript中常用内部对象属性、方法的使用。

第四章：内部对象系统的使用，本章主要介绍使用浏览器的内部对象系统，可实现与HTML文档进行交互。

第五章：WEB页面信息的交互——窗体与框架，本章主要介绍实现网页的动态交互，必须掌握有关窗体对象（Form）和框架对象（Frames）更为复杂的知识。

关键词：网页制作；网页设计；HTML；ASP3目录1.1网页设计概述 (4)1.2网页设计的要素 (4)1.3大作业目的和意义 (4)第二章 HTML网页设计技术的应用 (6)2.1HTML语言介绍 (6)2.1.1HTML语言的特点 (6)2.1.2HTML语言的编辑软件 (6)第三章色彩在网页中的应用 (7)3.1色彩在网页中的应用 (7)3.2主页色彩的处理 (7)3.3常用的配色方案 (7)第四章 WEB页面信息的交互——窗体与框架 (8)4.1窗体基础知识 (8)4.1.1窗体对象 (8)4.1.2窗体对象的方法 (9)4.2窗体中的基本元素 (9)4.3窗体对象实例 (11)4.4框架 (13)4.5框架的访问 (14)4.6本章小结 (17)第五章结论 (18)致谢 (19)参考文献 (20)4绪论第一章绪论随着21世纪的到来，人们更深切地感受到计算机在生活和工作中的作用越来越重要，越来越来的职业需要具有计算机的应用技能。

掌握计算机是职业的需要，更是事业发展的需要。

网页设计与制作是计算机能力的具体表现，本章主要介绍网页设计的相关知识。

1.1 网页设计概述网站是企业向用户和网民提供信息(包括产品和服务)的一种方式,是企业开展电子商务的基础设施和信息平台，离开网站（或者只是利用第三方网站）去谈电子商务是不可能的。

企业的网址被称为“网络商标”，也是企业无形资产的组成部分，而网站是INTERNET上宣传和反映企业形象和文化的重要窗口。

1.2 网页设计的要素网页设计的两大要素是：整体风格和色彩搭配。

一、确定网站的整体风格在这里，我提供给大家一些参考经验：1．将你的标志logo，尽可能的放在每个页面上最突出的位置。

2．突出你的标准色彩。

3．总结一句能反映贵站精髓的宣传标语！4．相同类型的图像采用相同效果，比如说标题字都采用阴影效果，那么在网站中出现的所有标题字的阴影效果的设置应该是完全一致的！二、网页色彩的搭配1．用一种色彩。

这里是指先选定一种色彩，然后调整透明度或者饱和度，这样的页面看起来色彩统一，有层次感。

2．用两种色彩。

先选定一种色彩，然后选择它的对比色。

3．用一个色系。

简单的说就是用一个感觉的色彩，例如淡蓝，淡黄，淡绿；或者土黄，土灰，土蓝。

1.3 大作业目的和意义本大作业主要是对网页设计与制作的语言基础上进行探讨，主要内容如下：通过已经做好的网页，分析html网页设计技术、XML技术、Java Applet技术和Javascript 技术在网页设计中的应用。

绪论 56第二章第二章 HTML网页设计技术的应用2.1 HTML语言介绍HTML（HyperText Mark-up Language）即超文本标记语言或超文本链接标示语言，是目前网络上应用最为广泛的语言，也是构成网页文档的主要语言。

HTML文本是由HTML命令组成的描述性文本，HTML命令可以说明文字、图形、动画、声音、表格、链接等。

HTML的结构包括头部（Head）、主体（Body）两大部分，其中头部描述浏览器所需的信息，而主体则包含所要说明的具体内容。

2.1.1 HTML语言的特点HTML文档制作不是很复杂，且功能强大，支持不同数据格式的文件镶入，这也是WWW盛行的原因之一，HTML语言的特点如下：1、简易性，HTML版本升级采用超集方式，从而更加灵活方便。

2、可扩展性，HTML语言的广泛应用带来了加强功能，增加标识符等要求，HTML 采取子类元素的方式，为系统扩展带来保证。

3、平台无关性。

虽然PC机大行其道，但使用MAC等其他机器的大有人在，HTML 可以使用在广泛的平台上，这也是WWW盛行的另一个原因。

2.1.2 HTML语言的编辑软件HTML的本质是文本，需要浏览器的解释，HTML的编辑器大体可以分为三种：1、基本编辑软件，使用WINDOWS自带的记事本或写字版都可以编写，当然，如果你用WPS来编写，也可以。

不过存盘时请使用.htm或.html作为扩展名，这样浏览器就可以解释执行了。

2、半所见即所得软件，这种软件能大大提高开发效率，它可以使你在很短的时间内做出Homepage，且可以学习HTML，这种类型的软件主要有HOTDOG，还有国产的软件网页作坊。

3、所见即所得软件，使用最广泛的编辑器，完全可以一点不懂HTML的知识就可以做出网页，这类软件主要有Frontpage，DREAMWEA VER、Delphi、Eclipse、UltraEdit。

第三章7 第三章色彩在网页中的应用3.1色彩在网页中的应用色彩是艺术表现的要素之一。

在网页设计中，我们的设计师根据和谐、均衡和重点突出的原则，将不同的色彩进行组合．搭配来构成美丽的页面。

根据色彩对人们心理的影响，合理地加以运用。

先选定一种色彩，然后调整透明度或者饱和度，这样的页面看起来色彩统一，有层次感。

简单的说就是用一个感觉的色彩，例如淡蓝，淡黄，淡绿；或者土黄，土灰，土蓝。

在网页配色中不要将所有颜色都用到，尽量控制在三至五种色彩以内。

背景和前文的对比尽量要大以便突出主要文字内容。

3.2主页色彩的处理色彩是人的视觉最敏感的东西。

主页的色彩处理得好，可以锦上添花，达到事半功倍的效果。

色彩总的应用原则应该是“总体协调，局部对比”，也就是：主页的整体色彩效果应该是和谐的，只有局部的、小范围的地方可以有一些强烈色彩的对比。

在色彩的运用上，可以根据主页内容的需要，分别采用不同的主色调。

因为色彩具有象征性，例如：嫩绿色、翠绿色、金黄色、灰褐色就可以分别象征着春、夏、秋、冬。

其次还有职业的标志色，例如：军警的橄榄绿，医疗卫生的白色等。

色彩还具有明显的心理感觉，例如冷、暖的感觉，进、退的效果等。

另外，色彩还有民族性，各个民族由于环境、文化、传统等因素的影响，对于色彩的喜好也存在着较大的差异。

充分运用色彩的这些特性，可以使我们的主页具有深刻的艺术内涵，从而提升主页的文化品位。

3.3常用的配色方案1.暖色调。

即红色、橙色、黄色、赭色等色彩的搭配。

这种色调的运用，可使主页呈现温馨、和煦、热情的氛围。

2.冷色调。

即青色、绿色、紫色等色彩的搭配。

这种色调的运用，可使主页呈现宁静、清凉、高雅的氛围。

3.对比色调。

即把色性完全相反的色彩搭配在同一个空间里。

例如：红与绿、黄与紫、橙与蓝等。

这种色彩的搭配，可以产生强烈的视觉效果，给人亮丽、鲜艳、喜庆的感觉。

8第四章最后，还要考虑主页底色（背景色）的深、浅，这里借用摄影中的一个术语，就是“高调”和“低调”。

底色浅的称为高调；底色深的称为低调。

底色深，文字的颜色就要浅，以深色的背景衬托浅色的内容（文字或图片）；反之，底色淡的，文字的颜色就要深些，以浅色的背景衬托深色的内容（文字或图片）。

这种深浅的变化在色彩学中称为“明度变化”。

当然，色彩的明度也不能变化太大，否则屏幕上的亮度反差太强，同样也会使读者的眼睛受不了。

第四章 WEB页面信息的交互——窗体与框架要实现网页的动态交互，必须掌握有关窗体对象（Form）和框架对象（Frames）更为复杂的知识。

4.1窗体基础知识窗体对象可以使设计人员能用窗体中不同的元素与客户机用户相交互，而用不着在之前首先进行数据输入，就可以实现动态改变Web文档的行为。

4.1.1窗体对象窗体（Form）：它构成了Web页面的基本元素。

通常一个Web页面有一个窗体或几个窗体，使用Forms[]数组来实现不同窗体的访问。

<form Name=Form1><INPUT type=text...><Input type=text...><Inpup byne=text...></form><form Name=Form2><INPUT type=text...><Input type=text...></form>在Forms[0]中共有三个基本元素，而Forms[1]中只有两个元素。

窗体对象最主要的功能就是能够直接访问HTML文档中的窗体，它封装了相关的HTML代码：<FormName ="表的名称"Target ="指定信息的提交窗口"action ="接收窗体程序对应的URL"Method =信息数据传送方式(get/post)第四章9 enctype ="窗体编码方式"[onsubmit ="JavaScript代码"]></Form>4.1.2 窗体对象的方法窗体对象的方法只有一个--submit()方法，该方法主要功用就是实现窗体信息的提交。

如提交Mytest窗体，则使用下列格式：document.mytest.submit()4.2 窗体中的基本元素窗体中的基本元素由按钮、单选按钮、复选按钮、提交按钮、重置按钮、文本框等组成。

在JavaScript中要访问这些基本元素，必须通过对应特定的窗体元素的数组下标或窗体元素名来实现。

每一个元素主要是通过该元素的属性或方法来引用。

其引用的基本格式见下：formName.elements[].methadName (窗体名.元素名或数组.方法)formName.elemaent[].propertyName(窗体名.元素名或数组.属性)下面分别介绍：（1）Text单行单列输入元素功能：对Text标识中的元素实施有效的控制。