记事本编辑HTML静态网页设计

山东信息职业技术学院

《网页设计》实验报告

（2010—2011学年第二学期）

班 级：

姓 名：

学 号：

指导老师：

实验一 认识Dreamweaver CS3

一、实验目的

1、熟悉Dreamweaver CS3环境。

2、了解HTML文件结构。

二、实验环境

计算机

三、实验内容

创建站点有两种方式：使用向导有序地进行设置，或者通过在“管理站点”对话框中设置“高级”选项卡信息来创建。无论哪种方式，都要事先在本地磁盘上建立一个用来存放站点的文件夹，这个文件夹就是本地站点的根目录。下面介绍一下这两种方式的具体操作步骤。

1．使用向导建立站点

使用向导建立站点的步骤如下：（1）打开建立站点向导的方法有3种。

①在进入Dreamweaver的起始页界面中选择“新建”→“Dreamweaver站点”命令，如图所示。

②选择“站点”菜单中的“新建站点”命令。

③选择“站点”菜单中的“管理站点”命令，打开如图所示的“管理站点”对话框，执行“新建”→“站点”命令。

起始页中新建站点 “管理站点”对话框

（2）打开“站点定义为”对话框，在“您打算为您的站点起什么名字”文本框中输入站点名字，如travel。若已申请域名则可以在“您的站点的HTTP地址（URL）是什么”文本框中填入申请的域名地址。如图所示。

设置站点名和URL地址 （3）单击“下一步”按钮，询问是否使用服务器技术，如图所示。若是静态站点则选中“否，我不想使用服务器技术”单选按钮，若是动态站点可以进一步设置使用哪一种服务器技术。

选择是否使用服务器技术

（4）单击“下一步”按钮，在“您将把文件存储在计算机上的什么位置”文本框中直接输入站点根目录的路径，或者单击“浏览”按钮，选择文件夹目录。

网页设计基础_html代码

不少人都学习网站的制作，但是又不知道从何入手，也能用一些傻瓜软件搭建自己的网站，但是不知道如何去修改自己的网页内容，从这篇文章开始，我会陆续的为大家介绍一下网页的制作以及div+css的东西，希望能对大家有所帮助。

我先来说一下我自己对网页设计的学习过程的一些理解。

1.要学会使用html代码编写一些相对简单的网页。这一步用电脑自带的记事本就可以完成了。

2.通过使用可视化软件学会div+css。这里我只介绍dreamweaver8，因为我学习的就是这个。

有了这两步的学习，那么你在网上看到的一些网页你应该大多数就能自己设计出来了。

废话不多说，进入今天的主题——html代码。

一个网页都是由很多代码写成的，虽然在内容上有很大的不同，但是每一个网页的整体结构是万变不离其宗的。

我们把网页比做一个人来说明：

首先，一个网页有他的“头”——

其实，网页还得有他的“身体”——，他们“内脏”——也就是网页的内容都在这里边。

这样出来的“人”是没穿衣服的，我们还得给他穿上“衣服”——

好了，这样这个人就能在大街上走路了，但是如果所有的“人”都是这样，那我们就没法分辨他们了，所以我们得给他们赋予自己的“面容”————这也是网页设置关键字的地方，很重要。 好，我们用记事本来写一下自己的第一个简单的网页。

这是我的第一个网页

大家好，我是我的第一个网页。

当你用记事本写完这些之后，保存，把后缀名改为.htm或.html，一般我们都用英文来命名。如first.htm,确定后，就可以打开看一下实际效果了，大家自己找一下title标签中写的内容在哪，body中写的又在哪，我在此就不多做解释了。

html设计实验报告

HTML设计实验报告

摘要：

本实验旨在通过设计一个简单的网页来学习和应用HTML标记语言。通过实践，我们深入了解了HTML的基本语法和标签，掌握了网页的基本结构和布局，以及如何添加文本、图像和链接等元素。通过本实验，我们不仅提高了对HTML的理论知识的掌握，还培养了动手实践和解决问题的能力。

1. 引言

HTML（超文本标记语言）是一种用于创建网页的标记语言。它由一系列的标签组成，通过标签来定义网页的结构和内容。HTML的设计简单易学，广泛应用于网页开发领域。

2. 实验目的

本实验的目的是通过设计一个简单的网页来熟悉和掌握HTML的基本语法和标签。通过实践操作，我们将学会如何创建网页的基本结构、布局和添加元素。

3. 实验过程

3.1 创建HTML文件

首先，我们需要创建一个新的HTML文件。可以使用任何文本编辑器，如记事本或Sublime Text等。在文件的开头和结尾分别添加和标签，表示这是一个HTML文档。

3.2 定义文档头部

在标签内，我们需要添加标签，用于定义文档的头部信息。在标签内，可以添加标签用于定义字符编码、网页标题等信息。 3.3 定义文档主体

在标签内，我们还需要添加标签，用于定义文档的主体内容。在标签内，我们可以添加文本、图像、链接等元素。

3.4 添加标题

使用

3.5 添加段落

使用

标签可以定义段落。在

标签内，我们可以添加任意文本内容。可以使用标签来实现换行。

3.6 添加图像

使用标签可以添加图像。需要指定图像的URL（统一资源定位符），可以是本地文件路径或者网络上的图片链接。

3.7 添加链接

使用标签可以添加链接。需要指定链接的URL和链接的文本内容。可以使用target属性来指定链接的打开方式。

4. 实验结果

通过实验，我们成功创建了一个简单的网页。网页的标题为"HTML设计实验报告"，包含了实验的摘要、引言、实验目的、实验过程和实验结果等内容。我们还添加了标题、段落、图像和链接等元素，使网页更加丰富和有趣。

第1章 HTML基础

HTML(超文本标记语言)是制作网页的基础。HTML标记是HTML的核心与基础，用

于修饰、设置HTML文件的内容及格式。

一个HTML文件中包含了所有将显示在网页上的文字信息。其中也包括对浏览器的一

些指示，如文字应放置在何处，显示模式如何等。如果还有一些图片、动画、声音或是任

何其他形式的资源，HTML文件也会告诉浏览器到哪里去查找它们，以及它们将放置在网

页中的什么位置。

教学目标

通过对本章的学习，读者应了解和掌握HTML的各种标记和语法，并能够使用HTML

设计简单的静态网页。

教学重点与难点 ● 使用HTML设计静态网页

● 编辑网页文本格式

● 创建超链接

● 使用表格

● 使用列表

1.1 网页基础知识

Internet是从Interconnected Networks延伸而来的，是跨国界的网络。Internet把世界各

地数以千万计的计算机和传输线路连接在一起构成一个网络。通过它可以交换信息、共享

资源，并以此为基础实现各种计算机通信应用项目。在Internet中，网页是它的重要组成

部分，本节首先介绍一些与网页相关的名词和概念。

1.1.1 万维网——WWW

WWW(World Wide Web)即环球信息网，也可以称为 Web，中文名字为“万维网”。

用户在使用浏览器来访问Web的过程中，无须关心一些技术性的细节即可得到丰富的

信息资料。WWW 是Internet上发展最快和目前使用最广泛的一种服务。 ASP动态网站开发教程 • 2 •

简单的说，WWW是漫游Internet网的工具，它把Internet上不同地点的相关信息聚集

起来，通过WWW浏览器(比如IE，Internet Explorer)检索，无论用户所需的信息在什么地

方，只要浏览器为用户检索到之后，就可以将这些信息(文字、图片、动画、声音等)“提

取”到用户的计算机屏幕上。

1.1.2 超文本传输协议——HTTP