当前位置：
文档之家› 静态网页制作教程 第一章 网页基础
静态网页制作教程 第一章 网页基础
英文名称 Black While Gray Sliver Red Green Blue Yellow
颜色 黑 白 灰 银灰 红 绿 蓝 黄
英文 Purple Olive Navy Aqua Lime Maroon Teal Fuchsia
颜色 紫 橄榄绿 深蓝 水蓝 青绿 茶色 墨绿 紫红
1.HTML标记
在html中，标记的语法如下： <标记名称>要控制的文字</标记名称> 当用一组html标记将一段文字夹在中间时，这段文字与夹文 字的标记被称为一个组件。如： <title>hehe</title> 这就是一个组件，其中的title即为元素名，<title>就是一个标 记，hehe为该元素的内容，有时在元素名后面还有属性。因 此，在html文件中某个组件的完整定义语法如下: <标记名称 属性1=“值1” 属性2=“值2” 属性3=“值3”……>组件 数据</标记名称> 由以上可知，标记元素有四种格式： 空元素（没有内容的元素） 带有属性的空元素 带有内容的元素 带有内容和属性的元素
另外，也可以利用十六进制数值方式来指定颜色，颜 色的表示方法如下： #RRGGBB 其中，RR代表红色、GG代表绿色、BB代表蓝色，我 们以00到FF的值表示三种颜色成分的多少，以指定 出三种原色以多少的成分组成新颜色。语法如下： <body bgcolor=“#00ff00”> 另外，ie支持3位数的颜色表示方法。与六位数的表 示方法类似，不过就是位数少而已 #RGB分别表示红绿蓝的成分。 例如：绿色可以用“#0F0”表示 （实例）
文档结构和格式的定义是由html元素来完成的。 而html元素是由单个或一对标记定义的包含范 围。一对标记是指一个起始标记和一个结束标 记。一个起始标记是由一个元素名和后面的一 个在小于号（<）和大于号（>）之间的属性/ 值对系列组成。结束标记在元素前有一个斜杠 （/），此外，它并不包括属性/值列表。
4.如果可能，应该将每一页都设计的简短一 些，每一页的文本及图形不应该超过一到两 个屏幕。如果一页太长，则读者不得不来回 滚动屏幕以阅读整份页面，这样就会打断文 档的流畅性。如果页面必须很长，则应在文 档中包括目录和指向特殊位置的链接，以使 读者便于找到所需信息。 5.不要在页面上ห้องสมุดไป่ตู้置太多的图形。图形文件 很大，意味着浏览器装载一页包括图形的页 面会非常费时。尽管你的网络连接可能非常 的迅速，但是别人访问你网页可能相对很慢。 6.在决定将自己的页面推向世界之前，应仔 细检查一下是否有错误和不佳之处。
了解HTML的发展信息
要掌握html，就必须了解它的发展。大家可以通过下 面俩个链接了解html文档草案的现状、未来html的发 展已经url的工作原理的升级文档等。 1./:提供一个链接指向描述已被确 认为internet标准及现在被所有浏览器支持的html特 性的文档。 2./hypertext/www/addressing/add ressing.html:讲解url的各种类型和如何在web文档中 使用它们。
4.利用图像作为WEB页面使得 背景
Background属性 指定作为html文件背景的图片，可以使用的图 文件格式为gif和jpg，其语法如下： Background=“文件名称与路径” 假如引用c:/html/sub/目录下的bg.gif图文件作 为html文件背景时，此属性的设置语法如下： Background=“c:/html/sub/bg.gif”
<html> <head> …… </head> <body> …… </body> </html>
Html
head
body
从上图中，我们可以容易的了解到整个html文件中 所有的数据均被建立为一个一个组件，并组织为一 个层次化的结构。 当利用html标记来定义组件时，定义标记不可交错， 否则将造成错误。下面的语法中，<head>标记与 <body>标记彼此交错，这样是不对的，如果标记 交错时，我们无法区别两个组件的范围 <html> <head> …… <body> 错误 </head> …… </body> </html>
四.WEB页面的颜色
通过<body>标记内属性的设置，来达到控制 web页面的颜色的效果，主要内容： 1.为web页面设置背景颜色 2.为web页面设置文本颜色 3.在web页面设置中为超文本链接设置颜色 4.利用图像作为web页面使得背景
1.为WEB页面设置背景颜色
Html允许编写者为其web页面选择各种各样 的颜色，包括背景、文本等等，这通过这种 <body>标记的常用属性 Bgcolor属性（用来控制页面的背景颜色） 语法：bgcolor=“颜色” 其中，颜色可以通过两种方式来表示，可以 直接指定颜色的英文名称，常用的基本颜色 名称如表：
<head>标记：建立的组件的内容为文件 标题。其中并不放网页的任何内容，而 是放置有关有关html文件的信息，例如： 文件的标题、编辑方式……等等。这些信 息大部分是提供索引、辨认和其他应用 之使用。 <body>标记：建立的组件是html文件的 主体，也就是网页的主要内容。依照各 种html的控制，这些内容将呈现在浏览 器的窗口中。 因此，所有文件的最基本结构如下：
寻找一个WEB编写工具
Html编辑器或编写工具是指不用进入html核心而为web 页面创建html文档的程序。这些程序所使用的格式与 允许人们在一页上输入文件或图形的字处理器或页面 设计程序相似。 许多字处理器，如microsoft word都具有html的编辑功 能。一般的，人们都使用windows自带的文本编辑器— —记事本程序来编写。还有一些软件，如microsoft frontpage和dreamweaver都内置一web编写工具，这使 得初学者在创建web页面时更简单。但是要学习更好的 网页设计制作（如动态网页等），必须要掌握html的 基本原理，所以这种情况下不宜使用frontpage和 dreamweaver等可视化的网页开发工具。
第一章 网页基础
一.www基础 二.网站和网页 三.Html基础及简单页面设计 四.Web页面的颜色 五.给html文档加注释
一.WWW基础
www（world wide web，简称互联网），一直 被人们称作internet的“杀手应用程序”。它可 以显示普通文字和图像并访问其他页面，而信 息子页则使得它成为internet上发展最快的部分。 你可能已经掌握了在web上如何探索信息世界， 但也有可能不太清楚如何向全世界发布你自己 的信息——有关你自己的信息，如你个人的兴趣、 你的工作等。 要创建自己的页面，最基础技术就是html （hypertext makeup language，超文本标记语 言），现在绝大多数web文档都是由html编写 的。
3.创建一个简单页面
创建一简单页面的基本步骤 1.打开一个html编辑器 2.编辑你的html文档 使用记事本程序 3.保存html文档 4.浏览你做的页面 <html> 文件扩展名为.html格式
<head> <title>我终于会自己设计页面了</title> </head> 两种方法： <body> 1.打开ie浏览 我终于会自己设计页面了哈哈 </body> 可以通过ie的菜单选项打开.html文件 </html>
注意：在html标记中，英文大小写字母 的意义是相同的，也就是说<html>和 <HTML>标记是一样的。 由于标记的存在和使用，html拥有层次 极为分明的基本结构。这对页面的制作 有很大的帮助。
2.HTML的基本结构
由于在HTML语法中，每个由html标记与文 字所形成的组件还可以包括另一组组件， 因此，整个html文件就像一个大组件，还包 含了许多小组件。 其中，所有的html文件最外层的组件，是由 <html>标记所建立的，在<html>标记所建 构的组件中，还包含了两个主要的子组件， 这两个子组件是由<head>标记与<body>标 记建立的。
www是一个全球性的、交互式的、动态的、 多平台的、分布式的、图像超文本的信息系 统。 访问者和网站有 不受地域的限制， 网站上的信息可 要能在web上四处遨游，首先必须安装一个 交互的过程，提交 一台服务器，多 可以在www上发 不受操作系统平 只要互联网保持连 以随时随地进行更 web浏览器。有了自己的web浏览器后，在 新 通就可以 信息、反馈信息 台的限制，如 台客户机构成分布 布多媒体信息，如 web上导航最简单的方法就是结合浏览器的 式 图像和声音、视频 windows、linnux等 各种性能在各页上移动。你可以通过选择指 系统平台 等 定的高亮度显示的文字、词或图像从一个页 面移至另一页面，也可以利用该页的地址或 url（uniform resource locator）统一资源定位 器来直接移至该指定页。
创建自己WEB页面的要点
有了上诉基本知识以后，就可以开始学习创建自己的 web页面了。不过，在创建自己的页面过程中，有一些 非常有用的技巧，必须好好的记住。 1.首先要搞清楚自己要说的东西。这看起来是很自然 的，但是许多页面的不成功就是由于它们缺少重点， 因为要展示给读者的观点一定要清楚明了。如果别人 搞不懂你想说什么，就不会有兴趣去读你的主页和其 他页面。 2.确定好目标之后，就应该考虑页面应包括的内容。 此时就应该按内容分割材料。材料可以分布在几页上， 也可以组合在同一页面中，这取决于你的写作方式。 3.除非页面非常短，否则编写一个简单介绍web站点的 目标、可得到信息及途径的简单页面是很有帮助的。 这一页面应包括内容介绍及目录，它可以使读者能对 继续阅读哪一页做出迅速的判断。此外，这一页上还 可包括指向有关所述论题的、更多信息的页面链接。
