简单Web服务器设计与实现

简单Web服务器设计与实现
简单Web服务器设计与实现

简单Web服务器设计与实现

摘要WWW的工作基于客户机/服务器计算模型,由Web 浏览器(客户机)和Web服务器(服务器)构成,两者之间采用超文本传送协议(HTTP)进行通信,HTTP协议的作用原理包括四个步骤:连接,请求,应答,关闭应答。在课程设计中,系统开发平台为Win7,程序设计语言采用Java,程序运行平台为Eclipse。在程序设计中,采用了结构化与面向对象两种解决问题的方法。程序通过调试运行,初步实现了设计目标,并且经过适当完善后,将可以应用在商业中解决实际问题。

关键词计算模型;Java;HTTP;Web服务器

1 前言

Internet是目前世界上最大的计算机互联网络,与大家的生活、学习、工作有着越来越密切的关系,它遍布全球,将世界各地各种规模的网络连接成一个整体,其用户群十分庞大,因此,建设一个好的Web站点对于一个机构的发展十分重要。近年来,随着网络用户要求的不断提高及计算机科学的迅速发展,特别是数据库技术在Internet中的广泛应用,Web站点向用户提供的服务将越来越丰富,越来越人性化。

本课程设计主要解决由Web 浏览器(客户机)和Web服务器(服务器)构成,两者之间采用超文本传送协议(HTTP)进行通信的Web服务器的程序设计。

1.1 课程设计前准备

以下的工作均是建立在大量的调查基础上的,是Web服务器开发前期准备工作所解决的问题。

(1)Java简介

Java是由sun公司开发的一种新型的面向对象的程序设计语言,主要用于web页面的设计[1]。Java语言的流行除了因为它能够编制嵌入HTML文件中的Applet外,还在于Java语言本身的面向对象、简单、平台无关性、安全性、多线程等特点。Java语言的发展颇具传奇性,它与Internet的WWW的迅猛发展是分不开的。由于其发展迅速,有人将它比喻为Internet上的世界语。前面讲到在Internet上Web页面的设计采用的是HTML语言,用户借助于Web浏览器(如Netscape,HotJava,IE等),可以访问到远程web服务器上静态的、具有超链接的Web页面[2]。

(2)HTTP协议简介

HTTP 协议是应用层的协议,定义了服务器端和客户端之间文件传输的沟通方式。HTTP协议用于从WWW服务器传输超文本到本地浏览器的传送协议。由于HTTP协议支持的服务不限于WWW,还可以是其它服务,它允许用户在统一的界面下,采用不同的协议访问不同的服务。它可以使浏览器更加高效,使网络传输减少。它不仅保证计算机正确快速地传输超文本文档,还确定传输文档中的哪一部分,以及哪部分内容首先显示等[3]。

1.2 课程设计的内容

(1)熟悉WWW服务器和WEB服务器的工作原理;

(2)熟悉套接字编程的相关知识;

(3)完成一个简单的WEB服务器的设计与实现,要求能够通过HTTP GET命令获得一个简单的HTML文件;

(4)运行该服务器,并编写一个简单的HTML文件完成测试。

1.3 课程设计要求

(1)按要求编写课程设计报告书,能正确阐述设计结果。

(2)通过课程设计培养学生严谨的科学态度,认真的工作作风和团队协作。

(3)学会文献检索的基本方法和综合运用文献的能力。

(4)在老师的指导下,要求每个学生独立完成课程设计的全部内容。

1.4 课程设计平台

Windows7系统;Eclipse软件平台

2 Web服务器的工作原理

2.1 HTTP协议的作用原理

WWW是以Internet作为传输媒介的一个应用系统,WWW网上最基本的传输单位是Web网页。WWW的工作基于客户机/服务器计算模型,由Web 浏览器(客户机)和Web服务器(服务器)构成,两者之间采用超文本传送协议(HTTP)进行通信。HTTP协议是基于TCP/IP协议之上的协议,是Web浏览器和Web服务器之间的应用层协议,是通用的、无状态的、面向对象的协议。HTTP协议的作用原理包括四个步骤:连接,请求,应答,关闭应答。

wsHTTP协议的作用原理包括四个步骤:

(1)连接:Web浏览器与Web服务器建立连接,打开一个称为socket(套接字)的虚拟文件,此文件的建立标志着连接建立成功。

(2) 请求:Web浏览器通过socket向Web服务器提交请求。HTTP的请求一般是GET或POST命令(POST用于FORM参数的传递)。GET命令的格式为:GET 路径/文件名HTTP/1.0 文件名指出所访问的文件,HTTP/1.0指出Web浏览器使用的HTTP 版本。

(3) 应答:Web浏览器提交请求后,通过HTTP协议传送给Web服务器。Web服务器接到后,进行事务处理,处理结果又通过HTTP传回给Web浏览器,从而在Web浏览器上显示出所请求的页面。

例:假设客户机与建立了连接,就会发送GET命令:GET /mydir/index.html HTTP/1.0。主机名为的Web服务器从它的文档空间中搜索子目录mydir的文件index.html。如果找到该文件,Web服务器把该文件内容传送给相应的Web浏览器。

为了告知Web浏览器传送内容的类型,Web服务器首先传送一些HTTP头信息,然后传送具体内容(即HTTP体信息),HTTP头信息和HTTP体信息之间用一个空行分开。

(4)关闭连接:当应答结束后,Web浏览器与Web服务器必须断开,以保证其它Web浏览器能够与Web服务器建立连接。

2.2 Java开发语言相关知识与技术

Java主要技术有:多线程,I/O流操作,网络编程。

2.2.1 java中的多线程及实现:

Java是面向对象的程序语言,用Java进行程序设计就是设计和使用类,Java为我们提供了线程类Thread来创建线程,创建线程与创建普通的类的对象的操作是一样的,而线程就是Thread类或其子类的实例对象。下面是一个创建启动一个线程的语句:Thread thread1=new Thread(); 声明一个对象实例,即创建一个线程;

Thread1.run(); 用Thread类中的run()方法启动线程;

从这个例子,我们可以通过Thread()构造方法创建一个线程,并启动该线程。事实上,启动线程,也就是启动线程的run()方法,而Thread类中的run()方法没有任何操作语句,所以这个线程没有任何操作。要使线程实现预定功能,必须定义自己的run()方法。Java中通常有两种方式定义run()方法:

通过定义一个Thread类的子类,在该子类中重写run()方法。Thread子类的实例对象就是一个线程,显然,该线程有我们自己设计的线程体run()方法,启动线程就启动了子类中重写的run()方法。

通过Runnable接口,在该接口中定义run()方法的接口。所谓接口跟类非常类似,主要用来实现特殊功能,如复杂关系的多重继承功能。

线程被实际创建后处于待命状态,激活(启动)线程就是启动线程的run()方法,这是通过调用线程的start()方法来实现的。

线程状态:

1)New

当线程对象被创建时,处于该状态。

2)Runnable:就绪状态,线程满足运行的所有条件但没有正在运行的线程位于该状态,有以下几种情况:

a.处于New状态的线程执行start()。

b.处于Running状态的线程失去CPU。

c.处于Otherwise Block状态的线程阻塞解除。

d.处于Lock Block状态的线程阻塞解除。

3)Running:运行状态

处于运行状态的线程可能发生以下几种情况:

a.线程运行结束,进入Dead状态。

b.CPU被分配给其它线程,进入Runnable状态。

c.满足Otherwise Block的条件,进入Otherwise Block状态。

d.由于锁的原因无法执行,进入Lock Block状态。

e.由于等待的原因无法执行,进入Wait Block状态。

4)Dead:死亡状态

线程运行结束,对于主线程main()结束,对于普通用户线程run()结束。

5)Otherwise Block:阻塞状态,阻塞解除后进入Runnable状态

a.调用sleep(),阻塞解除条件为阻塞时间满。

b.调用join(),阻塞解除条件为调用join()的线程执行结束。

注意:线程进入该状态不会释放锁。

6)Lock Block:锁阻塞状态,阻塞解除后进入Runnable状态

由于无法获得需要的锁而阻塞地线程进入该状态,阻塞解除条件为获得所需的锁。

7)Wait Block:等待阻塞状态,阻塞解除后进入Lock Block状态

由于某个资源的原因必须进行等待,则进入该状态。

阻塞解除条件为其它线程调用该资源的notify()或notifyAll()。

下面一个例子实践了如何通过上述两种方法创建线程并启动它们:

// 通过Thread类的子类创建的线程;

class thread1 extends Thread

{ 自定义线程的run()方法;

public void run()

{

System.out.println("Thread1 is running…");

}

}

通过Runnable接口创建的另外一个线程;

class thread2 implements Runnable

{ 自定义线程的run()方法;

public void run()

{

System.out.println("Thread2 is running…");

}

}

程序的主类'

class Multi_Thread 声明主类;

{

plubic static void mail(String args[]) 声明主方法;

{

thread1 threadone=new thread1(); 用Thread类的子类创建线程;

Thread threadtwo=new Thread(new thread2()); 用Runnable接口类的对象创建线程;

threadone.start(); threadtwo.start(); ()方法启动线程;

}

}

运行该程序就可以看出,线程threadone和threadtwo交替占用CPU,处于并行运行状态。可以看出,启动线程的run()方法是通过调用线程的start()方法来实现的(见上例中主类),调用start()方法启动线程的run()方法不同于一般的调用方法,调用一般方法时,必须等到一般方法执行完毕才能够返回start()方法,而启动线程的run()方法后,start()告诉系统该线程准备就绪可以启动run()方法后,就返回start()方法执行调用start()方法语句下面的语句,这时run()方法可能还在运行,这样,线程的启动和运行并行进行,实现了多任务操作。

2.2.2 I/O字节流操作

1)Java中使用流的方式处理数据,基本的处理类为InputStream(字节读入流)和OutputStream(字节输出流)。

2)可以使用各种过滤流对流数据进行过滤,实现各种附加功能。

3)对字节流进行转换和包装可以获得字符流,字符流的基本处理流为Reader(字符读入流)和Writer(字符输出流)。

a.字节流:

InputStream:int read()读入流中的一个字节并返回,数据存放在int的低8位中;int read(byte[])读入流中的若干个字节,存放在byte[]中,返回读入字节的数量;int read(byte[],int,int)读入流中的若干个字节,存放在byte[]中从第一个int参数开始(索引),最大长度为第二个int参数的区间内。

OutputStream:flush()将输出缓冲区中的信息写到真正的输出设备。

调用方法:

①输出缓冲区满:自动调用;

②调用close()时先调用flush():自动调用;

③手动调用flush()

最常见的情况是产生异常时,虽然在finally中会对流执行close(),但在异常条件下,close()能保证对流的关闭,但在调用flush()时会有漏洞。

b.字符流:

优点:操作文本数据时比较直观,读入和写出都以char为基本单位。

缺点:底层依然以字节流方式操作,所以在任何情况下都必须有转换的过程,效率相对较低。操作二进制数据时会存在编码问题,一般不使用字符流操作二进制数据。

InputStreamReader:将字节读入流转为字符读入流。

InputStreamReader(InputStream):使用默认字符集(取决的JVM)将InpustStream转为InputStreamReader。

InputStreamReader(InputStream, String):使用String指定的字符集将InputStream转为InputStreamReader。

OutputStreamWriter:将字符输出流转为字节输出流。

OutputStreamWriter(OutputStream):使用默认字符集(取决于JVM)将OutputStreamWriter转为OutputStream。

OutputStreamWriter(OutputStream, String):使用String指定的字符集将OutputStreamWriter转为OutputStream。

BufferedReader:提供缓冲;readLine()。

BufferedWriter:提供缓冲。

PrintWriter:提供缓冲;print()、println()等方法。

注意:在开发中,一般使用BufferedReader和PrintWriter结合使用完成对字符流的过滤。

2.2.3 网络架构:

1)C/S网络架构

客户端/服务器架构,通常情况下,数据存储在服务器端,客户端和服务器端都有一个独立的应用程序,可以进行独立的操作,通过网络进行数据传输。

常用的传输协议包括:

TCP/IP:基于连接的协议

优点:由于是有连接的传输,对于数据的准确性是有保证的。

缺点:系统资源占用较多。

UDP/IP:无连接的协议(数据报)

优点:系统资源占用少。

缺点:无法保证传输的准确性。

用途:

a.对于数据少量丢失可以接受的应用。

b.存在足够数据冗余的应用。

2)B/S网络架构

浏览器/服务器架构,在服务器端完成几乎所有的功能(包括数据存储),客户端的浏览器只完成和服务器交互和显示服务器传输的信息的功能。

常用的传输协议包括:

http:超文本传输协议。

https:支持多种加密操作的超文本传输协议。

优点:客户端不需要安装任何附加软件,同时整个应用的升级也相对简单。

IP:通过IP Address和Port(端口)定位具体的应用;Port的有效范围是0~65535,通常在开发应用时应避免使用1000以下的端口,1000以下有很多端口被常用应用占用。IP Address在JDK5.0中支持4位或6位两种方式,现在4位的占据主导地位,但将来会逐渐过渡到6位IP地址的模式。

TCP/IP协议的实现:

a.ServerSocket类:服务器端使用,用于监听客户端的请求。

b.Socket类:服务器端和客户端使用,用于完成具体通信的所有功能。

UDP/IP协议的实现:

a.DatagramSocket类:服务器端和客户端使用,用于实现通信的基本功能。

b.DatagramPacket类:服务器端和客户端使用,用于封装通信的内容信息。

3 开发环境及套字接编程

3.1 Web服务器的开发环境

该课程设计是基于Java编程语言的设计的Web服务器,开发环境是Eclipse软件和Java Swing。

(1)Eclipse简介

Eclipse 是一个开放源代码的、基于Java 的可扩展开发平台。就其本身而言,它只是一个框架和一组服务,用于通过插件和组件构建开发环境。Eclipse 附带了一个标准的插件集,包括Java 开发工具。Eclipse采用的技术是IBM公司开发的(SWT),这是一种基于Java的窗口组件,类似Java本身提供的AWT和Swing窗口组件,Eclipse 的插件机制是轻型软件组件化架构。在富客户机平台上,Eclipse使用插件来提供所有的附加功能[4]。

(2)Java Swing概述

Swing是不对等基于GUI工具箱的正式名字,它是Java基础类库的一部分。完整的JFC十分庞大,其中包含的内容远远大于Swing GUI工具箱。JFC特性不仅仅包含了Swing组件,而且还包含了一个可访问的API、一个2D API和一个可拖拽的API。Swing拥有一个丰富、便捷的用户界面元素集合,对底层平台依赖的很少,因此与平台相关的bug很少。Swing给予不同平台的用户一致的感官效果[5]。

3.2 Web服务器的套接字编程

Java提供了一个ServerSocket类,程序员可以很方便地用它编写服务器程序。服务器套接字的基本功能类似于坐在电话机旁边等待呼叫到来。从技术上讲,ServerSocket 运行在服务器上并监听到来的TCP连接。

每个ServerSocket都在服务器上的指定端口监听。当远程主机上的客户Socket试图与指定端口建立连接时,服务器被激活,判定客户程序与服务器的连接,并打开两个主机之间固有的Socket。一旦与服务器套接字建立了连接,则服务器就可以使用固有的Socket对象向客户机发送数据。数据总是通过固有的套接字传递。

3.2.1 ServerSocket类

ServerSocket类包含了用Java编写服务器程序的所有内容。它包括创建新ServerSocket对象的构造器、在指定端口监听连接的方法,以及连接建立后可以发送和接收数据时返回Socket对象的方法。此外,它还有设置不同选项以及各种各样常用的方法,例如toString()方法。

服务器的基本生命期是:

1. 利用ServerSocket()构造器在指定端口创建一个新的ServerSocket;

2. ServerSocket利用它的accept()方法在指定端口监听到来的连接。accept()方法一直

处于阻塞状态,直到有客户机试图建立连接。这时accept()方法返回连接客户机何服务器的Socket;

3. 调用getInputStream()方法、getOutputStream()方法或者两者都调用来得到与客户机通信的输入流和输出流,具体调用哪一个方法还是两者都调用与具体服务器的类型有关;

4. 服务器和客户机根据双方都承认的协议进行交互,直到关闭连接时为止;

5. 服务器、客户机或两者均关闭连接;

6. 服务器返回步骤2,等待下一个连接到来。如果在4步花费的时间很长或时间无限期,则wu-ftpd这样的传统Unix服务器会创建一个新的进程来处理每个连接,从而使服务器在同一时刻可以为多个客户机提供服务。

3.2.2 构造器

一共有3个公共ServerSocket构造器:

public ServerSocket(int port) throws IOException, BindException

public ServerSocket(int port, int queueLength)

throws IOException, BindException

public ServerSocket(int port, int queueLength, InetAddress bindaddress)

throws IOException

这些构造器允许用户指定端口、用于保存到来的连接请求队列的长度以及绑定本地网络的接口。它们的基本功能完全相同,但其中有一些使用默认的队列长度值和默认的绑定地址。

4 WEB服务器的设计与实现

4.1 Web服务器的程序设计流程

根据上述HTTP协议的作用原理,实现GET请求的Web服务器程序的方法如下:

(1) 创建ServerSocket类对象,监听端口8080。这是为了区别于HTTP的标准TCP/IP

端口80而取的;

(2) 等待、接受客户机连接到端口8080,得到与客户机连接的socket;

(3) 创建与socket字相关联的输入流instream和输出流outstream;

(4) 从与socket关联的输入流instream中读取一行客户机提交的请求信息,请求信息的格式为:GET 路径/文件名HTTP/1.0

(5) 从请求信息中获取请求类型。如果请求类型是GET,则从请求信息中获取所访问的HTML文件名。没有HTML文件名时,则以index.html作为文件名;

(6) 如果HTML文件存在,则打开HTML文件,把HTTP头信息和HTML文件内容通过socket传回给Web浏览器,然后关闭文件。否则发送错误信息给Web浏览器;

(7) 关闭与相应Web浏览器连接的socket字。

可以总结出Web服务器的设计流程并作出其设计流程图,如图4-1所示。

图4-1 Web服务器的程序设计流程

4.2 用Java实现Web服务器的主要设计步骤及程序

1.点击开始,打开eclipse软件,在左框内建立Java工程,在工程中分别建立相应的包和类,如图3-2所示。

图4-2在工程中分别建立相应的包和类

2.设计主函数程序

在Java工程中建立包main和类WebServerMain,在对应框中输入以下程序:package com.web.main;

import com.web.gui.WebServerFrame;

public class WebServerMain {//接口的实现

public static void main(String[] args) {

new WebServerFrame();

}

}

3.设计Web服务器的图形界面

在Java工程中建立包gui和类WebServerFrame,在对应框中输入以下程序:package com.web.gui;

import java.awt.*;

import java.awt.event.*;

import javax.swing.*;

import https://www.360docs.net/doc/b411701843.html,.WebServerNet;

public class WebServerFrame extends JFrame implements ActionListener { private JMenuBar menuBar = new WebServerJMenuBar(this);

// 按钮面板

Private JPanel btnPan = new JPanel(new FlowLayout(FlowLayout.CENTER));

//将按钮面板选择布局管理器进行布局管理构建北部面板

private JLabel listenPortLb = new JLabel("服务器监听端口: ");// private JTextField portTf = new JTextField("1111", 5);//宽度设置为5 private JButton controlBtn = new JButton("开始");//设置按钮名称private JButton clearHintBtn = new JButton("清空");

// 提示信息面板

private JTextArea hintTa = new JTextArea();

private WebServerNet net;

public WebServerFrame() {

initComponent();

net = new WebServerNet(this);

}

//初始化所有界面组件

private void initComponent() {

setJMenuBar(menuBar);

buildBtnPan();

buildHintPan();//建立按键

setSize(400, 300);//设置按键大小

Toolkit tool = Toolkit.getDefaultToolkit();

setLocation((tool.getScreenSize().width - this.getSize().width) / 2, (tool.getScreenSize().height - this.getSize().height) / 2

);

this.addWindowListener(new WindowAdapter(){

public void windowClosing(WindowEvent arg0) {

WebServerFrame.this.setVisible(true);

WebServerFrame.this.dispose();

}

});//设置容器的大小

setTitle("IIS Web服务器V01");//命名服务器的名字

setDefaultCloseOperation(EXIT_ON_CLOSE);

setVisible(true);

}

//构建按钮面板

public void buildBtnPan() {

btnPan.add(listenPortLb);

btnPan.add(portTf);

btnPan.add(controlBtn);

btnPan.add(clearHintBtn);//加入所有按键

add(btnPan, BorderLayout.NORTH);//将按键放置在北部面板

portTf.requestFocus();

portTf.selectAll();

controlBtn.addActionListener(this);

clearHintBtn.addActionListener(this);

}

//构建信息面板

public void buildHintPan() {

hintTa.setEditable(false);

JScrollPane scrollPane = new JScrollPane();

scrollPane.setBorder(BorderFactory.createLoweredBevelBorder());

scrollPane.getViewport().add(hintTa);

add(scrollPane, BorderLayout.CENTER);

//将构建内容面板放置在容器的中间

hintTa.setText("请按“开始”按钮来开启Web服务器。");

}

//各个出现的问题监测

public void actionPerformed(ActionEvent arg0) {

Object source = arg0.getSource();

//判断按钮提示文字内容

if (source == clearHintBtn) {

hintTa.setText("");

return;

}

String msg = controlBtn.getText();

if (msg.equals("开始")) {

controlBtn.setText("停止");

portTf.setEditable(false);

net.start(portTf.getText());

} else {

controlBtn.setText("开始");

portTf.setEditable(true);

net.stop();

}

}

public void addHint(String s) {

hintTa.setText(hintTa.getText() + "\r\n" + s);

}

}

5 测试运行

5.1 调试运行

为了确保上述程序的正确性,进行调试运行,在工程中建立Folder,并在其内建立html文件,如图5-1所示。

图5-1 添加html文件

在index.html文件中输入“大家好,我是来自通信0702班的丁弟。我的课程设计是《简单的WEB服务器的设计与实现》,我所用的语言是JA V A。谢谢大家。”如下图5-2所示。

图5-2在index.html文件中输入如图字样

接着点击Web服务器中的“开始”,开启Web服务器结果显示为如图5-3所示。

图5-3 点击Web服务器中的“开始”

然后打开浏览器,输入网址,即Web服务器把该文件内容传送给了相应的Web浏览器。刷新得到如图5-4所示:

图5-4 把文件内容传送给相应的Web浏览器

服务器窗口显示内容如图5-5所示:

5-5 运行服务器访问结果

6 结束语

随着网络在人们日常生活中的应用越来越广泛和嵌入式技术在日常生活中的地位日愈凸显。这对我们这些有关网络专业的学生既是一种挑战,也是一个机遇。通过这次课程设计让我初步了解了Web服务器的设计和工作原理,掌握了一些JA V A语言和学会使用Eclipse编程软件,对我的网络编程有了很大的提高。与此同时我还学到了一些专业知识之外的东西。

课程设计的过程中,我了解到课程设计不光光是埋头做设计,也是同学之间互相学习,互相交流经验的机会;也是大家向老师提出疑问和解答疑问的机会。我觉得课程设计是一个复习课堂上学到知识的机会,也是一个加强学生动手设计能力的机会。设计起初我遇到了一些问题,后来我通过上网,查阅书籍和请教老师,对一些问题有了初步了解。当然在老师和同学的热心帮助下,我慢慢解开了课程设计中遇到的一些问题,慢慢揭开这门设计的神秘面纱,最终完成了我的课程设计。

这次课程设计不仅考察了我们对课堂学的专业知识的理解程度,也锻炼了我们的动手能力,提高了我们独立思考问题,解决问题的能力。总体上看,我觉得这次课程设计使我自身的知识丰富了不少,但是同时也发现了自己在动手和专业知识方面存在的一些问题,例如知识不能融合,不能与实践相结合,软件操作不够熟练,不能灵活运用。使我了解要先学好理论知识才能很好的与实践相结合,才能熟练的运用到生活中。

人机交互技术Web界面设计

人机交互技术 Web界面设计学号: 姓名:

一、Web界面设计的基本概况 Web界面设计是人机交互界面设计的一个延伸,是人与计算机交互的演变。 Web界面设计与站点外观直接相关,站点的界面外观是否友好直接关系到是否能吸引人的关注。人性化的设计是Web界面设计的核心,如何根据人的心理、生理特征,运用技术手段,创造简单、友好的界面,是Web界面设计的重点。 用来解释Web的人机界面性质的一个模型,它提出网页是用户和知识之间的界面。对于信息提供者来说包括信息的表达,对于使用者来说则是信息的获取。信息的表达与获取分别受到两者认知结构的制约。 模型涉及到信息的三种类型 1)数据:当一条信息被反复、简单的提供时称为数据,比如机票价格。 2)复杂信息:而用来叙述事件时称为复杂信息,如多媒体信息。 3)过程性信息:在信息有明确目标,并相互作用时称为过程性信息,如在线练习、在线测试等。 模型涉及到信息的两种特性:1)动态性:信息在不断的变化,具有动态性; 2)一致性:信息元素的组织方式具有一致性 (2)Web信息设计模型 是解释Web人机界面性质的另一个模型,是一种研究网页的信息设计模型。 设计模型中要考虑到信息的两个方面: 1)第一是应该呈现或略去什么信息。 2)第二个方面指的是信息该如何被表现。 二、Web界面设计要求及目的 Web应用的成功与否,除了受其所采用的技术和所能够提供的功能的限制还受Web网页的外观的影响。Web网页的外观经常是最先被用户注意到的。用户对网站的第一印象与界面外观是否友好、吸引人密切相关。所以对于设计人员来说,Web界面设计至关重要。Web界面设计的人性化、易用性是Web界面设计的核心。 Web界面设计要素 a)Web界面布局

web界面设计

一、实验目的和要求 1) 熟悉Web站点的信息交互模型和结构 2) 熟悉Web界面设计的基本思想和原则 3) 掌握Web界面设计的工具和技术 二、实验内容与原理 (一) 实验内容: 要求根据Web界面设计的原则(简洁、一致性、对比度),进行Web界面规划、概要设计和设计要素的选择,利用一种界面设计工具(Dreamweaver / Frontpage)完成网页设计。 (二)实验步骤: 1)选择一种界面设计工具,并熟悉它; 2)针对一个具体的网站(学校、个人、公司)设计应用,进行Web界面规划和概要设计; 3)选择WEB界面设计要素,设计出网页 三、设计方案 1)使用的数据库是MySQL,数据库表如图所示: news表: news_user表:

2)该网站为新闻发布系统,该网站有浏览新闻、添加新闻、修改新闻、删除新闻功能。用户权限分为管理员、普通用户权限。 a)网站主页 b)单击标题,检测如果未登陆,进入登陆页面

c)如果没有登陆账号,则进行注册

d)如果登陆成功则进入新闻浏览界面。如果是普通用户,浏览界面如图所示: 如果是权限用户,浏览界面如图所示: e)详细内容:

f) 如果是管理员用户,则有更新新闻权限,如下图所示: f) 如果是管理员用户,则有添加新闻权限,如下图所示:

我使用的开发工具是VS2012,工程类型为https://www.360docs.net/doc/b411701843.html, Web Forms Application.VS2012集成了https://www.360docs.net/doc/b411701843.html, MVC 4,全面支持移动和HTML5,WF 4.5相比WF 4,更加成熟。该版本中包含了新的Metro应用程序模板,增加了JavaScript功能、一个新的动画库,并提升了使用XAML的Metro应用程序的性能。 3)网站业务流图

一个Web系统的界面设计和开发

一个Web系统的界面设计和开发1.工作流程(下图,是整个开发过程中与界面设计相关的主要流程工作) 从最初需求分析开始,我就加入项目,自始自终参加整个开发过程。 在需求分析阶段,参与了对客户的访问和调研; 在概要设计阶段,参与了部分系统设计分析工作; 在详细设计阶段,完成了整个系统界面设计和Demo制作,并提交用户反馈; 在代码开发阶段,参与了系统表现层的设计开发。

2.需求分析 在需求分析阶段,主要针对界面交互相关问题,对用户进行若干调研。 主要包括以下内容 ·受众用户群调查 ·系统使用环境调查 ·受众用户使用习惯调查 ·用户对旧版本软件使用情况调查 这一阶段,由于成本原因,我并没有直接访问客户进行调查。工作主要是提出某些具体问题,由需求调研人员,以问卷或口头问答方式,对客户进行调研。另外,公司经验丰富的客服人员和市场人员,也是非常重要的需求来源之一。 本系统的客户群主要为国家省市下属质检单位,最终受众年龄从年轻到较高龄都有。对于普通国家机关人员,一般对计算机系统和网络不够熟悉,计算机环境一般,甚至比较差,少有配置优良的环境。在这种环境下,用户对计算机使用一般没有使用倾向,大多更适应手工操作。对本系统的前代使用,最主要意见是使用困难,不方便。 还有其他具体调查反馈,如用户基本不使用鼠标右键,年龄较大的用户难以看清密集的较小文字等等。 3.界面设计原则 在概要设计阶段,根据需求阶段的调研结果,我整理了系统界面设计的基本原则。因为在代码开发阶段,很多时候界面的具体制作是由开发人员直接写代码,因此必须确定一定的原则和规范,以保证系统界面的统一。 一般适用原则 ·简单明了原则:用户的操作要尽可能以最直接最形象最易于理解的方式呈现在用户面前。对操作接口,直接点击高于右键操作,文字表示高于图标示意,尽可能的符合用户对类似系统的识别习惯。 ·方便使用原则:符合用户习惯为方便使用的第一原则。其它还包括,实现目标功能的最少操作数原则,鼠标最短距离移动原则等。 ·用户导向原则:为了方便用户尽快熟悉系统,简化操作,应该尽可能的提供向导性质的操作流程。 ·实时帮助原则:用户需要能随时响应问题的用户帮助。 ·提供高级自定义功能:为熟悉计算机及软件系统的高级用户设置自定义功能,可以对已经确定的常规操作以及系统的方方面面进行符合自身习惯的自定义设置。包括常规操作、界面排版、界面样式等种种自定义。 ·界面色彩要求:计算机屏幕的发光成像和普通视觉成像有很大的不同,应该注意这种差别作出恰当的色彩搭配。对于需用户长时间使用的系统,应当使用户在较长时间使用后不至于过于感到视觉疲劳为宜。例

Web界面设计规范方案

Web应用界面设计规范(Design Specific ation for Web UI) 主讲人:ARay 目录: 一、软件界面规范的重要性及其目的 二、用户体验为何如此重要 三、Web规范体系介绍 四、界面设计开发流程 五、应该遵循的基本原则 六、界面设计规范 一、软件界面规范的重要性及其目的 ①使最终设计出来的界面风格一致化,开发编码人员相互之间开发更轻松,遵循统一的操作规范,以标准化的方式设计界面,提高工作效率。减少和改变责任不明,任务不清和由此产生的信息沟通不畅、反复修改、重复劳动、效率低下的现象。 ②产品设计通过规范的方式来达到以用户为中心的目的。 二、用户体验为何如此重要 ①日常生活中的遭遇 X员工悲惨的一天: 早晨起来,发现闹钟没有按原先设定响起来。 一边烧水,一边穿衣服,临走前去喝水却发现水还没有烧开。 到了地铁站,发现公交卡没有钱了。 无奈之下只能去排队买票。 排了3趟地铁,终于到公司了,但是你却迟到了。 结果:尽管你已经非常努力,但是你还是迟到了。 那么,让我们看看这一连串 的倒霉事, 是什么让我们如此狼狈? ②什么是用户体验

用户体验(user experience)是以用户为中心的设计中最重要的一个部分,强调的是过程,是软件对用户行为产生的反应与用户期待值要尽可能的一致。 糟糕的用户界面表现: 表现一:过分使用各种奇形怪状、五颜六色的控件。 表现二:界面元素比例失调。比如按钮巨大无比,其尺寸甚至超过显示重要内容的文本框的界面。 表现三:界面元素凌乱。比如说,按钮和文本框摆放地点随意,该对齐的控件对不齐。 表现四:违背使用习惯。你按F1,它没有弹出帮助,却执行了一件绝对出乎你意料的动作。表现五:消息框信息含糊、混乱。比如软件弹出一个消息框。把原本“确定”和“取消”写成为“是”和“否”,让用户不知道什么意思。 表现六:还有一种糟糕的用户界面,乍一看很厉害,实际上完全是缺乏规划的结果。这种

Web界面设计规范

Web应用界面设计规范(Design Spe cification for Web UI) 主讲人:ARay 目录: 一、软件界面规范的重要性及其目的 二、用户体验为何如此重要 三、Web规范体系介绍 四、界面设计开发流程 五、应该遵循的基本原则 六、界面设计规范 一、软件界面规范的重要性及其目的 ①使最终设计出来的界面风格一致化,开发编码人员相互之间开发更轻松,遵循统一的操作规范,以标准化的方式设计界面,提高工作效率。减少和改变责任不明,任务不清和由此产生的信息沟通不畅、反复修改、重复劳动、效率低下的现象。 ②产品设计通过规范的方式来达到以用户为中心的目的。 二、用户体验为何如此重要 ①日常生活中的遭遇 X员工悲惨的一天: 早晨起来,发现闹钟没有按原先设定响起来。 一边烧水,一边穿衣服,临走前去喝水却发现水还没有烧开。 到了地铁站,发现公交卡没有钱了。 无奈之下只能去排队买票。 排了3趟地铁,终于到公司了,但是你却迟到了。 结果:尽管你已经非常努力,但是你还是迟到了。 那么,让我们看看这一连串 的倒霉事, 是什么让我们如此狼狈? ②什么是用户体验 用户体验(user experience)是以用户为中心的设计中最重要的一个部分,强调的是过程,是软件对用户行为产生的反应与用户期待值要尽可能的一致。 糟糕的用户界面表现: 表现一:过分使用各种奇形怪状、五颜六色的控件。 表现二:界面元素比例失调。比如按钮巨大无比,其尺寸甚至超过显示重要内容的文本框的界面。

表现三:界面元素凌乱。比如说,按钮和文本框摆放地点随意,该对齐的控件对不齐。 表现四:违背使用习惯。你按F1,它没有弹出帮助,却执行了一件绝对出乎你意料的动作。 表现五:消息框信息含糊、混乱。比如软件弹出一个消息框。把原本“确定”和“取消”写成为“是”和“否”,让用户不知道什么意思。 表现六:还有一种糟糕的用户界面,乍一看很厉害,实际上完全是缺乏规划的结果。这种软件本身的确提供了比较复杂的功能,但对于哪些是常用功能,哪些是很少用到的高级功能,缺乏评估。什么功能都往界面上挤,占地方不说,用户会厌烦,弄不好还会被吓跑。

Web界面设计

1100310120 潘飞达 Web界面设计 一实验目的和要求 1) 熟悉Web站点的信息交互模型和结构 2)熟悉Web界面设计的基本思想和原则 3)掌握Web界面设计的工具和技术 二预备知识 Web界面设计是人机交互界面设计的一个延伸,是人与计算机交互的演变。Web界面设计与站点外观直接相关,站点的界面外观是否友好直接关系到是否能吸引人的关注。人性化的设计是Web界面设计的核心,如何根据人的心理、生理特征,运用技术手段,创造简单、友好的界面,是Web界面设计的重点。(1)Web信息交互模型 模型涉及到信息的三种类型 1)数据:当一条信息被反复、简单的提供时称为数据,比如机票价格。 2)复杂信息:而用来叙述事件时称为复杂信息,如多媒体信息。 3)过程性信息:在信息有明确目标,并相互作用时称为过程性信息,如在线练习、在线测试等。 模型涉及到信息的两种特性: 1)动态性:信息在不断的变化,具有动态性; 2)一致性:信息元素的组织方式具有一致性 (2)Web信息设计模型 设计模型中要考虑到信息的两个方面: 1)第一是应该呈现或略去什么信息。 2)第二个方面指的是信息该如何被表现。 (3)Web界面设计基本原则

1)了解浏览者的心理状态 2)内容与形式的统一 3)减少浏览层次 4)特点明确 5)统一整体的形象 6)Web界面设计的3C原则 (4)Web界面概要设计 1)Web界面框架设计:Web网站规划、建立原型系统、详细设计、正式实施 2)Web界面的内容与风格的设计:网站内容设计的原则、Web界面的风格 3)Web界面设计的语言与文化:网站应设置多语言选择,在网站设计和建设中进行跨文化研究 (5)Web界面设计要素 ?Web界面布局 ?Web界面的色彩 ?Web界面的字体 ?Web界面的动画与多媒体 ?Web界面的导航 (6)Web界面设计技术与工具 主要的技术包括超文本标记语言HTML、客户端脚本语言JavaScript、JavaApplet、服务器端脚本语言。 三、实验内容 1、选择界面设计工具:Dreamweaver ,辅助工具Photoshop 2、设计内容:糗事百科网页 本网站内容充实,在主页的设计上运用了模板,框架等。分页面上运用了导航条。专业机构的研究表明,彩色的记忆效果是黑白的3.5倍,所以网站要色彩丰富。本网站的底色为浅棕色,配以白色和棕色的文字,色彩搭配非常适宜。 在导航条中,链接处显得简单明确,分类合理,让人一目了然。整个界面简单大气,毫无冗余和凌乱之感,十分赏心悦目。

WEBUI设计要求规范

内蒙古万德系统集成有限公司 WEB UI设计(流程/界面)规范 目录 一:UI设计基本概念与流程...................................................................................................... - 3 - 1.1 目的.................................................................................................................. - 3 - 1.2范围 .................................................................................................................. - 3 - 1.3 概述.................................................................................................................. - 3 - 二:UI界面用户体验设计原则与规范.............................................................................................. - 4 - 1:应该遵循的基本原则..................................................................................................... - 4 - 2:页面外观规范........................................................................................................... - 4 - ②宽带页面........................................................................................................... - 5 - ③自适应............................................................................................................. - 5 - ④其他页面........................................................................................................... - 5 - 基本结构.............................................................................................................. - 6 - 页面版式:............................................................................................................ - 6 - 版块基本元素:所谓基本元素就是将其中任意几块元素拼接起来形成所需网页版块。............................................ - 6 - 版块组合形式.......................................................................................................... - 7 - 3:色彩规范............................................................................................................... - 8 - 4:字体规范.............................................................................................................. - 10 - ①文字格式......................................................................................................... - 10 - ②标题类............................................................................................................ - 12 -

Web应用界面设计规范

Web应用界面设计规范 主讲人:ARay 目录: 一、软件界面规范的重要性及其目的 二、用户体验为何如此重要 三、Web规范体系介绍 四、界面设计开发流程 五、应该遵循的基本原则 六、界面设计规范 一、软件界面规范的重要性及其目的①使最终设计出来的界面风格一致化,开发编码人员相互之间开发更轻松,遵循统一的操作规范,以标准化的方式设计界面,提高工作效率。减少和改变责任不明,任务不清和由此产生的信息沟通不畅、反复修改、重复劳动、效率低下的现象。 ②产品设计通过规范的方式来达到以用户为中心的目的。 二、用户体验为何如此重要

①日常生活中的遭遇 X员工悲惨的一天: 早晨起来,发现闹钟没有按原先设定响起来。 一边烧水,一边穿衣服,临走前去喝水却发现水还没有烧开。到了地铁站,发现公交卡没有钱了。 无奈之下只能去排队买票。 排了3趟地铁,终于到公司了,但是你却迟到了。 结果:尽管你已经非常努力,但是你还是迟到了。 那么,让我们看看这一连串 的倒霉事, 是什么让我们如此狼狈?

②什么是用户体验 用户体验(user experience)是以用户为中心的设计中最重要的一个部分,强调的是过程,是软件对用户行为产生的反应与用户期待值要尽可能的一致。 糟糕的用户界面表现: 表现一:过分使用各种奇形怪状、五颜六色的控件。 表现二:界面元素比例失调。比如按钮巨大无比,其尺寸甚至超过显示重要内容的文本框的界面。 表现三:界面元素凌乱。比如说,按钮和文本框摆放地点随意,该对齐的控件对不齐。表现四:违背使用习惯。你按F1,它没有弹出帮助,却执行了一件绝对出乎你意料的动作。 表现五:消息框信息含糊、混乱。比如软件弹出一个消息

开发部web界面设计规范

开发部Web界面设计规范 版本修订历史

1.目录结构规范 1)目录建立原则:以最少的层次提供最清晰的访问结构。 2)目录的命名以小写英文字母、下划线组成。 3)根目录一般只放index.html已经其他必须的系统文件。 4)根目录下的images用于存放各页面都要使用的公用图片。 5)所有JS等脚本存放在根目录下的scripts或js目录。 6)所有CSS文件存放在根目录下的style或css目录。 2.设计命名规范 页面基本框架结构 navbar container—就是将页面中的所有元素包在一起的部分 header—是页面的头部区域,一般来讲,它包含网站的logo和其他一些元素 navbar—等同于横向的导航栏,是最典型的页面元素,也可以命名为nav menu—此区域包含一般的链接和菜单,也可以命名为subNav,links main—是网站的主要区域,也可以命名为content sidebar—此区域包含网站的次要内容,例如最近更新内容列表等。 footer—包含一些附加信息,也可以命名为copyright 命名规则注意点 1)尽量考虑为元素命名其本身的作用或用意,达到语义化不要使用表面形式命名,如:red/left/big 等 2)组合命名规则:[元素类型]-[元素作用/内容]。如搜索按钮btn-search、登录表单form-login。 3)凡涉及交互行为的元素通常会有正常、悬停、点击和已经浏览等不同样式。参考:搜索按钮 btn-search、btn-search-hover、btn-search-visited

图片命名规则 1)图片名称分为头尾两部分,用下划线隔开。禁止用中文名。 2)头部分表示此图片的大类性质。 例如:放置在顶部的长方形图片可以取名banner;标志图片取名logo;位置不固定并且带有链接的小图片取名button;做栏目链接的图片取名menu;不带链接表示标题的取名title;装饰的照片取名pic;等。 3)尾部分用来表示图片的具体含义,用英文字母表示,如banner_ad.gif logo_firefox.gif button_next.gif menu_aboutus.gif title_news.gif pic_people.jpg 4)有onmouse效果的图片,两张分别在原有文件名后加”_on”和”_off”命名。

一个Web系统OA界面设计和开发

一个Web系统OA界面设计和开发 早在中国IT业方兴未艾之时,计算机应用系统主要以功能实现为主,几乎没有界面设计这个概念。时至今日,随着计算机和网络的不断普及,社会信息化程度日益加深,用户和市场的不断成熟,人们已经不仅仅满足于“够用”,而是更加强调“好用”“易用”;因此,不论是普通最终用户的个人软件,还是企业应用的大型系统,界面设计在系统构建中都成为了一个非常重要的方面。 但是,(至少在中国)由于IT业发展滞后、市场还不够成熟等原因,在绝大多数企业中,界面设计在软件系统开发中还没有获得与之重要性相匹配的一席之地,并且在企业运作和协调中也没有形成成熟的模式和解决方案,如何做好界面设计和开发,仍然是大家不断研究探讨的一个问题。 我写这篇文章,主要内容是我参加一个面向质检行业的Web系统界面设计和开发工作的过程,包括其间的一些构思和想法;希望能和大家一起探讨一下这个问题,供大家参考。 另外,我同时承担了系统开发和界面设计工作,所以,虽然这是一篇讨论界面设计的文章,我会尽量把文章限制在界面设计范围内,但也有可能包含一些开发和系统设计的内容,请大家辨析清楚,欢迎指正。 1.工作流程 下图,是整个开发过程中与界面设计相关的主要流程工作。

从最初需求分析开始,我就加入项目,自始自终参加整个开发过程。 在需求分析阶段,参与了对客户的访问和调研; 在概要设计阶段,参与了部分系统设计分析工作; 在详细设计阶段,完成了整个系统界面设计和Demo制作,并提交用户反馈; 在代码开发阶段,参与了系统表现层的设计开发。 2.需求分析 在需求分析阶段,主要针对界面交互相关问题,对用户进行若干调研。 主要包括以下内容 ·受众用户群调查 ·系统使用环境调查 ·受众用户使用习惯调查 ·用户对旧版本软件使用情况调查 这一阶段,由于成本原因,我并没有直接访问客户进行调查。工作主要是提出某些具体问题,由需求调研人员,以问卷或口头问答方式,对客户进行调研。另外,公司经验丰富的客服人员和市场人员,也是非常重要的需求来源之一。 本系统的客户群主要为国家省市下属质检单位,最终受众年龄从年轻到较高龄都有。对于普通国家机关人员,一般对计算机系统和网络不够熟悉,计算机环境一般,甚至比较差,少有配置优良的环境。在这种环境下,用户对计算机使用一般没有使用倾向,大多更适应手工操作。对本系统的前代使用,最主要意见是使用困难,不方便。 还有其他具体调查反馈,如用户基本不使用鼠标右键,年龄较大的用户难以看清密集的较小文字等等。 3.界面设计原则 在概要设计阶段,根据需求阶段的调研结果,我整理了系统界面设计的基本原则。因为在代码开发阶段,很多时候界面的具体制作是由开发人员直接写代码,因此必须确定一定的原则和规范,以保证系统界面的统一。 一般适用原则 ·简单明了原则:用户的操作要尽可能以最直接最形象最易于理解的方式呈现在用户面前。对操作接口,直接点击高于右键操作,文字表示高于图标示意,尽可能的符合用户对类似系统的识别习惯。 ·方便使用原则:符合用户习惯为方便使用的第一原则。其它还包括,实现目标功能的最少

WEB界面设计

中北大学 实验报告 专业软件工程 课程名称人机交互的软件工程方法学号1121011502 姓名吴亚楠

辅导教师常旭青成绩

3.政府部门 内容: 政府网站,即是指一级政府在各部门的信息化建设基础之上,建立起跨部门的、综合的业务应用系统,使公民、企业与政府工作人员都能快速便捷地接入所有相关政府部门的政务信息与业务应用,并获得个性化的服务,使合适的人能够在恰当的时间获得恰当的服务。但是,具体到中央政府和地方政府而言,由于政府职能的巨大差异,中央政府门户网站和地方政府(特别是地级市政府)门户网站在具体功能、体系结构及业务流程等方面存在着很大的不同。就具体功能来说,中央政府门户网站主要是向全社会甚至是世界宣传和展示中国政府形象,让人们能够对中央政府的基本情况有个切实的理解和认识;向公众提供全面、系统、权威、详实的法律、法规、部门规章以及规范性政府文件及其准确的解读和分析等,让社会有法可依;作为中央门户,向人们提供接入所有中央政府机构和省级地方政府的平台和通道;根据特定内容,向公众提供专门的服务。而地方政府门户网站的主要功能是直接面向本地社会公众处理与人们密切相关的那些事务,为提高政府行政效率、改善地方经济社会发展环境搭建虚拟平台。 功能: 门户网站是政府部门信息发布的总平台,也是政府部门集中对外提供服务的总平台,这个平台能够为政府提供虚拟主机、电子邮件、信息检索等服务;能通过导航程序在技术、功能等方面实现网站间有机衔接;能对政府部门的网站域名、应用项目、网页风格、电子邮箱、连接方式、数据结构等进行统一规划、管理;政府网站建设能起到政府对外宣传和招商引资的作用;能为广大公众在网上浏览咨询直接办事提供服务,把电子政务推进到实用阶段。 布局: 分栏为主 风格: 建设部网站的设计风格基本代表了中央部委网站的设计风格,蓝色调为主,最上面是政府单位名称,紧跟着是频道设置、部委动态、职能设置、行政许可等等,而且部委网站设置功能比较齐全,更新速度比较及时,政策性功能大于办事功能等。

Web页面设计规范

Web页面设计规范 编号: 版本号: 受控状态: 作者: 分发号:

文档修改历史记录文档修改记录

目录 1引言6 1.1 目的 6 1.2 范围 6 1.3 缩略术语 6 1.4 参考资料 6 2WEB页面框架内容6 2.1 页面框架 6 2.2 页面布局 6 2.2.1 布局原则 6 2.2.2 布局要求7 2.2.2.1 页面分割7 2.2.2.2 页面结构8 2.2.2.3 页面展现9 2.2.2.4 页面美化10 2.3 页面字体11 2.4 边距11 2.5 表格12 2.6 段落排版13 2.7 Frame 13 2.8 其他页面元素14 3页面风格15 3.1 风格分类15 3.2 页面风格应用15

4WEB页面交互15 4.1 页面元素焦点切换16 4.1.1 信息填写16 4.1.2 鼠标交互响应16 4.2 页面信息交互18 4.2.1 操作结果确认18 4.2.2 其他规则18 4.3 页面信息提示19 4.4 键盘响应支持21 5WEB页面通用规范22 5.1 一般页面功能22 5.1.1 新增22 5.1.2 修改22 5.1.3 删除22 5.1.4 查询23 5.1.5 取消23 5.1.6 保存23 5.1.7 重置23 5.1.8 返回23 5.1.9 分页23 5.1.10 全选24 5.2 一般页面规则24 5.2.1 默认值 24 5.2.2 必填值 24

5.2.3 界面传递25 5.2.4 窗口嵌套25 5.2.5 输入框操作25 5.2.6 在线帮助功能25 5.2.7 菜单功能要求26 5.2.8 快捷键功能27 5.2.9 快捷键的限制27 5.2.10 页面的规范性28 5.2.11 系统易用性29 5.2.12 输入安全性要求30 5.2.13 独特性要求31 5.2.14 多窗口的应用与系统资源31 6页面编程技术使用规范32 6.1 页面元素命名32 6.2 DHTMLx控件35 6.3 Flex控件35 7页面资源规格说明35 7.1 图标35 7.2 图片36 7.3 多媒体 36 8附录37 8.1 基于DHX的CSS规格示例37 8.1.1 表格CSS示例 37 8.2 典型应用的页面示例37

相关主题
相关文档
最新文档