西乡蓝河湾休闲会所:HTML教程1

来源:百度文库 编辑:九乡新闻网 时间:2024/04/24 02:27:51
HTML入门
HTML英语意思是:Hypertext Marked Language,即超文本标记语言,是一种用来制作超文本文档的简单标记语言。用HTML编写的超文本文档称为HTML文档,它能独立于各种操作系统平台(如UNIX,WINDOWS等)。自1990年以来HTML就一直被用作World Wide Web 的信息表示语言,用于描述Homepage的格式设计和它与WWW上其它Homepage 的连结信息。使用HTML语言描述的文件,需要通过WWW浏览器显示出效果。
所谓超文本,因为它可以加入图片、声音、动画、影视等内容,因为它可以从一个文件跳转到另一个文件,与世界各地主机的文件连接。
通过HTML可以表现出丰富多彩的设计风格
图片调用:
文字格式:文字
通过HTML可以实现页面之间的跳转
页面跳转:〈A HREF="文件路径/文件名">
通过HTML可以展现多媒体的效果
声频:
视频:
HTML中也提供了相应的标题标签,其中n为标题的等HTML总共提供六个等级的标题,n越小,标题字号就越大,以下列出所有等级的标题:
〈H1>…     第一级标题
〈H2>…     第二级标题
〈H3>…     第三级标题
〈H4>…     第四级标题
〈H5>…     第五级标题
〈H6>…     第六级标题
代码部分
换行

段落标签


水平线段


有三个属性:
size 水平线的宽度
width 水平线的长,用占屏幕宽度的百分比或象素值来表示
align 水平线的对齐方式,有LEFT RIGHT CENTER三种
noshade 线段无阴影属性,为实心线段
文字的大小设置这是size=7的字体
文字的字体与样式
文字的颜色
位置控制
说明:#=left/right/center
表格的基本结构
...
 定义表格
... 定义标题
 定义表行
 定义表头
 定义表元(表格的具体数据)
表格的标题:
设置标题位于表格上方:
...
设置标题位于表格下方:
...
表格尺寸设置:
表格的大小:
width和height属性分别指定表格一个固定的宽度和长度,n1和n2可以用像素来表示,也可以用百分比(与整个屏幕相比的大小比例)来表示。
边框尺寸设置:边框是用border属性来体现的,它表示表格的边框边厚度和框线。将border设成不同的值,有不同的效果。如:

格间线宽度:格与格之间的线为格间线,它的宽度可以使用
中的CELLSPACING属性加以调节。格式是:#表示要取用的像素值
内容与格线之间的宽度:我们还可以在
中设置CELLPADDING属性,用来规定内容与格线之间的宽度。格式为#表示要取用的像素值
背景色彩和文字色彩

bgcolor --- 背景色彩
text --- 非可链接文字的色彩
link --- 可链接文字的色彩
alink --- 正被点击的可链接文字的色彩
vlink --- 已经点击(访问)过的可链接文字的色彩
#=rrggbb
色彩是用 16 进制的 红-绿-蓝(red-green-blue, RGB) 值来表示。
16 进制的数码有: 0,1,2,3,4,5,6,7,8,9,a,b,c,d,e,f.
背景图象
Non Scrolling Background
文件之间的链接
超文本中的链接是其最重要的特性之一,使用者可以从一个页面直接跳转到其他的页面、图象或者服务器。一个链接的基本格式如下:
链接文字
·标签表示一个链接的开始,表示链接的结束;
·属性“HREF”定义了这个链接所指的地方;
·通过点击“链接文字”可以到达指定的文件。
本地链接:
现在我们把这几种路径的表示方法写入链接中:
以绝对路径表示:文件的链接
以相对路径表示:文件的链接
链接上一目录中的文件:IP地址
URL链接
************
URL链接的形式是:  协议名://主机.域名/路径/文件名
其中协议包括:
file      本地系统文件
http      WWW服务器
ftp       ftp服务器
telnet     基于TELNET的协议
mailto     电子邮件
news      Usenet新闻组
gopher     GOPHER服务器
wais      WAIS服务器
写在HTML文件中,链接其他主机上的文件时,格式如下:
动网先锋
类别一
序号
标签符号
命令作用
备注
创建Web页
1



为建立HTML文件头应放入的信息,以及在浏览窗口的标题框内一什么样的名称去调用该文件。

我的主页

2
,
强调显示
隐式格式化标记
3


空标记
上下两句话之间被一条水平线隔开
4

,


段落标记
多数情况下,Web浏览器只认识字间只有一个空格,忽略字间的其他空格和HTML文件中加入的回车。
5


分行标记
它在Web文件中强制实现换行
6

注释标记
通常使用注释标记是处于个人目的的,因此可以用注释写上一个版权信息或者个人情况
7

,


标题标记
第一级字号最大,用于总标题
8

,


第二级小一些,用于大分标题
9

,


第三级再小些,用于小分标题
10

,


第四级字号大小和正常字号相同
11
,

第五级也加强调,但比正常字号小
12
,

第六级最小
13
,
强调显示标记
黑体
14
,
斜体
15
,
下划线文本
16
,
隐式标记
一般再现为等宽字体文
17
,
进一步强调,一般为斜体
18
,
进一步强调,一般为黑体
19
,
程序员的HTML标记.HTML早期被用来编制计算机程序应用说明,为计算机编程人员提供便利和建议。后来,HTML2.0标准提供了一些(逻辑的》HTML标记,从而使HTML设计人员可以对文本做标记使得该文本能够更容易展示计算机编程代码。
编程行,一般再现为等宽字体,如
20
,
键盘文本,一般再现为等宽字体
21
,
样本输出,一般再现为等宽字体
22
,
变量,一般为等宽字体
23
,
排版类标记
引文,一般再现为斜体
24
,

块引述,一般再现为缩格
图像标志
1.
2.

再简单朴素的网页如果只有文字而没有图像的话将失去许多活力,图像在网页制作中是非常重要的一个方面,Html语言也专门提供了标志来处理图像的输出。
1.
标志并不是真正地把图像给加入到Html文档中,而是将标志对的src属性赋值,这个值是图形文件的文件名,当然包括路径,这个路径可以是相对路径,也可以是网址。实际上就是通过路径将图形文件嵌入到您的文档中。您可能并不知道什么是相对路径,我现在就来讲一讲相对路径。所谓相对路径是指您所要链接或嵌入到当前Html文档的文件与当前文件的相对位置所形成的路径。假如您的Html文件与图形文件(文件名假设是logo.gif)在同一个目录下,则可以将代码写成;假如您的图形文件放在当前的Html文档所在目录的一个子目录(子目录名假设是images)下,则代码应为;假如您的图形文件放在当前的Html文档所在目录的上层目录(目录名假设是home)下,则相对路径就必须是准网址了,即用“../”表示您的网站,然后在后边紧跟文件在您的网站中的路径,假设home是您的网站下的一个目录,则代码应为,若home是您的网站下的目录king下边的一个子目录,则代码应该变为了。现在您对相对路径应该有所了解了吧!
必须强调一下,src属性在标志中是必须赋值的,是标志中不可缺少的一部分。除此之外,标志还有alt、align、border、width和height属性。align是图像的对齐方式,在前边的教程中已经讲了很多了,这里就不再提了。border属性是图像的边框,可以取大于或者等于0的整数,默认单位是像素。width和Height属性是图像的宽和高,默认单位也是象素。alt属性是当鼠标移动到图像上时显示的文本。
2.


标志是在Html文档中加入一条水平线,它可以直接使用,具有size、color、width和noshade属性。size是设置水平线的厚度,而width是设定水平线的宽度,默认单位是像素。想必大家对color属性已经很熟悉了,在此就不再用多讲。noshade属性不用赋值,而是直接加入标志即可使用,它是用来加入一条没有阴影的水平线(不加入此属性水平线将有阴影)。
下面是本教程的一个综合例子。
例5 图像标志举例


图像标志的综合示例


网页制作






本例在浏览其中的显示结果如下:
教程六、链接标志
1.
2.
教程六的内容不是很多,而且很简单。链接是Html语言的一大特色,正因为有了它,我们对内容的浏览才能够具有灵活性和网络性。
1.
本标志对的属性href是无论如何不可缺少的,标志对之间加入需要链接的文本或图像(链接图像即加入标志)。href的值可以是URL形式,即网址或相对路径,也可以是mailt形式,即发送E-Mail形式。对于第一种情况,语法为,这就能创建一个超文本链接了,例如:
这是我的网站
对于第二种情况,语法为,这就创建了一个自动发送电子邮件的链接,mailt后边紧跟想要制动发送的电子邮件的地址(即E-Mail地址),例如:
这是我的电子信箱(E-Mail信箱)
此外,还具有target属性,此属性用来指明浏览的目标帧,我们将在讲帧标志时作详细的说明,这里您只要知道如果不使用target属性,当浏览者点击了链接之后将在原来的浏览器窗口中浏览新的Html文档,若target的值等于“_blank”,点击链接后将会打开一个新的浏览器窗口来浏览新的Html文档。例如:
这是我的网站
2.
标志对要结合标志对使用才有效果。标志对用来在Html文档中创建一个标签(即做一个记号),属性name是不可缺少的,它的值也即是标签名,例如:
此处创建了一个标签
创建标签是为了在Html文档中创建一些链接,以便能够找到同一文档中的有标签的地方。要找到标签所在地,就必须使用标志对。例如要找到“标签名”这个标签,就要编写如下代码:
点击此处将使浏览器跳到“标签名”处
注意:href属性赋的值若是标签的名字,必须在标签名前边加一个“#”号。
下面是本教程的一个综合示例:
例7 链接标志的综合示例


链接标志的综合示例




创建标签处





欢迎想要学习网页制作的同学访问我的网站

">http://bbs.dvbbs.net/



alt="欢迎访问"网页制作"" border="0" width="468" height="60">




本网站的主要内容



Html教程



动态Html教程



ASP教程



JavaScript教程



VBScript教程



友情链接



我要留言



作者介绍





欢迎给我来信,我的E-Mail是:
123@263.net



点击此处回到标签处






教程八、表单标志
1.

2.
3.

创建一个表格

表格中的每一行

表格中一行中的每一个格子

设置表格头:通常是黑体居中文字

设置边框的宽度

设置表格格子之间空间的大小

设置表格格子边框与其内部内容之间空间的大小

设置表格的宽度。用绝对像素值或总宽度的百分比

设置表格格子的水平对齐方式(左中右)

设置表格格子的垂直对齐方式(上中下)

设置一个表格格子跨占的列数(缺省值为1)

设置一个表格格子跨占的行数(缺省值为1)

禁止表格格子内的内容自动断行
 
 
标题标志

将文档的题目放在浏览器的标题栏中
文本标志

预先格式化文本


最大的标题

最小的标题

黑体字

斜体字

打字机风格的字体

引用,通常是斜体

强调文本(通常是斜体加黑体)

加重文本(通常是斜体加黑体)

设置字体大小,从1到7

设置字体的颜色,使用名字或RGB的十六进制值
链接标志

创建超文本链接


创建自动发送电子邮件的链接

创建位于文档内部的书签

创建指向位于文档内部书签的链接
帧标志

放在一个帧文档的标签之前,也可以嵌在其他帧文档中

定义一个帧内的行数,可以使用绝对像素值或高度的百分比

定义一个帧内的列数,可以使用绝对像素值或宽度的百分比

定义一个帧内的单一窗或窗区域

定义在不支持帧的浏览器中显示什么提示

规定帧内显示的HTML文档

命名帧或区域以便别的帧可以指向它

定义帧左右边缘的空白大小,必须大于等于1

定义帧上下边缘的空白大小,必须大于等于1

设置帧是否有滚动栏,其值可以是"yes","no" 或"auto"

禁止用户调整一个帧的大小
 
格式标志


创建一个段落


将段落按左、中、右对齐


插入一个回车换行符


从两边缩进文本

定义列表

放在每个定义术语词前

放在每个定义之前

    创建一个标有数字的列表

      创建一个标有圆点的列表

    • 放在每个列表项之前,若在
        之间则每个列表项加上一个数字,若在
          之间则每个列表项加上一个圆点

          用来排版大块HTML段落,也用于格式化表
          表单标志

          创建表单

          创建滚动菜单,size设置在需要滚动前可以看到的表单项数目