(HyperText MarkUp Language)是使用特殊标记来描述文档结构和表现形式的一种语言,由W3C (World Wide Web Consortium) 所制定和更新。我们可以用任何一种文本编译起来编辑HTML文件,因为它就是一总纯文本文件。 下面我们来看一小段HTML语言的代
码,来了解HTML语言的基本结构:
HTML(HyperText MarkUp Language)是使用特殊标记来描述文档结构和表现形式的一种语言。将这一小段代码粘贴至文本文件中,然后选择“另存为”,将文件的后缀名改为.htm或者.html即可,然后在所在的目录下就可看到一个IE的图标,名字就是你所存的文件名称。这是声明HTML文件的语法格式。每一个HTML文件,都必须以开头,以结束这是文件头声明的语法格式。在这
之内的所有文字都属于文件的文件头,并不属于文件本体。 这是声明文件标题的语法格式。在这之中写下的所有内容,都将写在网页最上面的标题栏中。这是声明文件主体的语法格式。在这之间写下的内容都是文件的主体,也就是说将会被显示在客户区之中。 注意:几乎每一种HTML语言的语法都是以开头,以结
束。
在编辑HTML语言过程中,也可以使用注释。语法格式为:文件注释->。就好像C语言中的 /* …… …… */ 一样,中间的内容
只是解释说明,并不被编译器所编译。
长度单位可以用来定义水平线、表格边匡、图像等对象的长、宽、高等一系列属性,同时也可以用来定义这些对象在页面上的位置
等属性,用来描述页面上可能遇到的各种长度。
长度的表示方法有两种:绝对长度和相对长度。他们的单位都是像素 (pixel)(用px表示)和百分比(%),像素代表的是屏幕上的每个点,而百分比代表的是相对于客户区的多少。下面我们就以水平
线的宽度为例,说明这两种表示方法。
HTML语言的长度表示
HTML(HyperText MarkUp Language)是使用特殊标记来
描述文档结构和表现形式的一种语言。
在文本编译器中编译,改变网页的大小,就会看到这两者表示
长度方法的不同。
其中标记是在页面上建立水平线的标记。
是水平线元素中的一种属性,用来表示水平线的宽度。
这里即表示这个水平线的宽度是500像素;即表示水平线占据客户区的总宽度的%50。
和长度单位一样,颜色单位也是描述页面表现形式的一种很重
要的的数据类型。颜色单位有三种表示方法:
这三种表示方法不同,但是效果却是一样的。下面用一小段代
码说明这三种颜色的表示方法:
HTML语言中颜色的不同表示方法
静夜思
英文>
窗前明月光
进制颜色代码>
疑是地上霜
十进制RGB码>
举头望明月
进制颜色代码>
低头思故乡
颜色代码>
本文件在保存时请选择字符型进行保存。 。16进制颜色代码之前必须有一个“#”号,这种颜色代码是由三部分组成的,其中前两位代表红色,中间两位代表绿色,后两位代表蓝色。不同的取值代表
不同的颜色,他们的取值范围是00--FF。
语法格式:。在这种表示法中,后面三个参数分别是红色、绿色、蓝色,他们的取值范围是0--255。以上两种表达方式可以相互转换,标准是16进制与10
进制的相互转换。
可以在代码中直接写出颜色的英文名称。
以上三种表示方法的效果相同,一般16进制颜色代码的表示方法比较常用。读者可以根据自己的喜好和实际情况来决定使用哪一种
表示方法。关于不同颜色的定义,请查看相关资料。。
路径是一种互联网地址的表示法。在这个数据里可以包括以何种协议连接、要连接到哪一个地址、连接地址的端口 (Port) 号以及服务器(Server)
里文件的完整路径和文件名称等信息。
在HTML中,URL路径分为两种形式:绝对路经和相对路径。 绝对路径是将服务器上磁盘驱动器名称和完整的伦够写出来,同时也会表现出磁盘上的目录结构。 语法格
式:
:
其中,是某一种传输协议,而则是连接的位置信息。 例
如:
相对路径是相对于当前的HTML文档所在目录或站点根目录的路径。 语法格式: 相对关系 / 部分路径
根据相对路径的参照点又可以分为相对文档的相对路径以及相
对根目录的相对路径。
相对文档: 这种路径的表现形式是根据目标文档所在目录和当前文档所在目录之间的关系的一种表现形式。“../”表示上一级目录,没有“../”表示当前目录。 例如当前文档的路径是:。我们要找test目录下的html.htm 。而当前的目录是project1,我们要回到上一级目录中,所以路径是
“../html.htm”。
相对根目录: 这种路径根据目标文档相对于根目录的关系的一种表现形式。在这种表达式种的第一个字符是“/”,这个符号表示这个路径是一个相对于根目录的表达式。 例如:
这一课介绍文档中部分的基本使用方
法。 head这一部分是由标记开始,以标记结束,是html文档的首要部分。下面我们看一下head部分所包含的元素:
元素
title 描述 文档标题
meta 描述非html标准的一些文档信息
link 描述当前文档与其他文档之间的连接关系
base 定义体试时默认的外部资源
script 脚本程序内容
style 样式表内容 下面简要介绍一下各个部分的功能及用法:
文档标题 title包含的内容将会被显示在浏览器窗口的标题栏中。给自己的网页起一个适当的名字,可以体现出一些自己的个性。 语法格式: …… …… 在省略号处加入
的文字或符号,都将显示在浏览器的标题栏中。
描述非html标准的一些文档信息 meta元素提供的
信息是用户不可见的。下面是meta的几种用法:
定义搜索关键字: 这里介绍两种基本的用法:
="html,css,javascript">
这样一来,在你的网页中就会体现出这样的信息。但是这些信
息是不可见的,只是提供给那些搜索引擎使用。
控制页面缓存: 浏览器一般为了节约时间,都在本地硬盘上保存一个网上的文件作为临时版本。在用户下次打开这个网页的时候,浏览器将会直接调用硬盘上的这个版本,而不是网上的。如果想让浏览者每次打开网页的时候都是看到的最新版本,那么就在网页上
加上这一句吧!
我们可以通过这样的
语句设定语言的编码方式。这样,浏览器就可以为我们正确的选择语
言,不需要我们来选取。
上面的例子显示的就是简体中文,如果想要显示繁体中文,将
GB3212替换为BIG5就可以了。
http-equiv="refresh"content="60",URL="new.htm"> 这样的语句可以让我们的浏览器按照content属性中制定的时间来跳转到
URL属性中设定的URL地址。
上面的例子就是在打开页面60秒后调用一个新的页面new.htm。如果没有能够找到new.htm,浏览器就﹞执行刷新本页的操作。这也
是大多数聊天室的设定方法。
描述当前文档与其他文档之间的连接关系 这个元素用来指定当前文档和其他文档之间的联接关系。 语法格式:
rel="描述" href="URL地址">
说明两个文档之间的关系;
说明目标文档名。
以下是一个指定外联样式表文件的例子:
rel="stylesheet" href="style.css"> 关于css层叠样式表,请查
阅有关资料。
定义体试时默认的外部资源 用于定义文档提交是默认的外部资源。 语法格式:
窗口名称">
指定文档中链接到的所有文件默认的URL地址。在这里指定href的属性,所有的相对卢劲的前面都会加上href属性中
的值。
指定文档中所有链接的默认打开窗口。最常见的应用是在框架页中。我们要把Menu框架中的联接显示到
content框架中,就可以在Menu的网页中加上。这样,就省去了在Menu网页上所有链接的
属性上加上target属性了。
脚本程序内容 标记用来在页面中加入脚本程序。 语法格式: 在language中一定要指定脚本语言的种类。如VBScript等。 样式表内容 用来指定当前文档的css层叠样式表。css对于网页的字体样式、背景、边界等都有很大的应用。详细部分请大
家参阅css有关内容。
大家从各大门户网站的主页上就可以看出,部分占据了大部分的代码。可见body是一个网页代码的绝对主要部分。body是由开始,由结束。下面我们看一下body部分的元
素:
元素
bgcolor 描述 背景色
background
text
link
alink
vlink
leftmargin
topmargin 背景图案 文本颜色 链接文字颜色 活动链接文字颜色 已访问链接文字颜色 页面左侧的留白距离 页面顶部的留白距离
下面介绍各个部分的功能及用法:
背景色 用于指定页面的背景颜色。在Microsoft公司的IE浏览器中,默认情况下是白色,Netscape公司的Navigator浏览器的默认情况是灰色。语法格式: 背景图案background 属性用于指定页面的背
景图案。语法格式:
下面是几种文字的属性,可以改变文字的颜色,以及在页面上留出空白:text, link, alink, vlink, leftmargin, topmargin
文本颜色即非链接文字的颜色;
链接文字颜色即可连接文字的颜色;
活动链接文字颜色即正被点击的可链接文字的颜色; 已访问链接文字颜色即已被点击的可链接的文字的颜色;
页面左侧的留白距离;
页面顶部的留白距离。
语法格式: 示例:
body元素示例
这里显示body的示例。
这样的属性,大多数html的页面已经不使用这样的用法了。现在多数是在head中加入相应的代码。要达到的效果是鼠标放到有链接的字体上时,字体变色,点击后字体变为灰色。具体方法如下: A:link {color:#00007f;} A:visited {color:#65038e;} A:active
{color:#ff0000;} A:hover {color:#ff0000;}
将这段代码加入到head中,在body中加入有链接的文字,就可以看出效果了。这一部分是属于css中的知识。在body中加入有链接的文字:在Dreamweaver中,选定文字后,在下面的Properties中的link中加入想要链接到的页面的地址。在FrontPage中,选定
文字后,点击右键就会有相应的选项。
第一课基础
Html 是英文 HyperText Markup Language 的缩写,中文意思是“超文本标志语言”,用它编写的文件(文档)的扩展名是.html或.htm,它们是可供浏览器解释浏览的文件格式。您可以使用记事本、写字板或 FrontPage Editor 等编辑工具来编写Html文件。Html语言使用标志对的方法编写文件,既简单又方便,它通常使用来表示标志的开始和结束(例如标志对),
因此在Html文档中这样的标志对都必须是成对使用的。
当我们畅游Internet时,我们透过浏览器所看到的网站,是由HTML (HyperText Markup Language) 语言所构成。HTML ( 超文件标记语言 ) (Tag),将影像、声音、图片、文字等连结显示出来。 HTML标记是由所括住的指令,主要分为:单标记指令(只有,没有)、双标记指令 ( 由,所构成 ) 。HTML网页文件可由任何文本编辑器或网页专用编辑器编辑,完成后 ( 以 .htm 或 .html 为文件后缀保存 ) 将HTML网页文件由浏览器打开显示,若测试没有问题则可以放到
服务器 (Server) 上,对外发布信息。
标头区开始
...标题区
标头区结束
本文区开始
本文区结束 文件结束
标头区 : 记录文件基本资料,如作者、编写时间。 标题区 : 文件标题须使用在标头区内,可以在浏览器最
上面
本文区 : 文件资料,即在浏览器上看到的网站内容。 通常一份HTML网页文件包含二个部份: 标头区、 本文区。而
代表网页文件格式。
习惯上一个网站的首页名称通常订为 index.htm 或 index.html 这样只要浏览网站,浏览器便会自动的找出 index.htm
文件。
第二课字体
设定标题字体大小, n = 1 ( 大 ) ~ 6 ( 小 ) 会自动跳下一行。通常用在如章节、段落等标题上。
如:
如 :
如:粗体字 粗体字
如:斜体字 斜体字
如:横线
如:打字体 打字体
...上标字
如:字体上标字字体上标字
如:字体下标字字体下标字
如:
第三课表格
表格是html的一项非常重要功能,利用其多种属性能够设计出多样化的表格。使用表格可以使你的页面有很多意想不到的效果,使
页面更加整齐美观。
表格指令
相关属性: ·
调整
背景颜色
边框
高度
宽度 表格标题
相关属性: align:调整 表格列 (
可省略 ) 。
相关属性:align:调整 表格栏标题 ( 表头 ) 粗体字 (
可省略 ) 。
相关属性:
调整
栏宽
栏高 表格栏资料 ( 储存格 ) (
可省略 ) 。
相关属性:
调整
背景颜色
高度
宽度
栏宽
栏高
举例 如:( 基础型 )
太平洋网络学院
太平洋网络学院 太平洋网络学院
太平洋网络学院
太平洋网络学院 太平洋网络学院 太平洋网络学院 太
平洋网络学院
如:( 加强型 ) 增加背景颜色、表格标题、栏标题、跨
栏宽、跨栏高。
表格标题
行标题 1
行标题 2
列标题 1
a
a
a
a
b
b
b
b
列标题 2
c
c
c
c
d
d
d
d
第四课标示
提供许多种类的标示标记,作项目标示,而且可以作巢状式标
示!
标示项目。 如:
* 第一项
* 第二项
1. 第一项 2. 第二项
,可标示数字或英文、罗马字母。 如:
* 第一项
* 第二项
i. 第一项 ii. 第二项
,可标示数字或英文、罗马字母。 如:
* 第一项
* 第二项
? 第一项 ? 第二项
定义项目。
定义资料。
...
。 如:
十进制:
0、1、2、3、4、5、6、7、8、9 十六进制:
0、1、
2、3、4、5、6、7、8、9、a、b、c、d、e、f
十进制: 0、1、2、3、4、5、6、7、8、9 十六进制:
0、1、2、3、4、5、6、7、8、9、a、b、c、d、e、f
巢状式标示如 :
* 第一章
* 第一节
* 第一段
* 第二段
* 第二节
* 第二章
* 第三章
1. 第一章
i. 第一节
第一段
第二段
ii. 第二节
2. 第二章
3. 第三章
( 自动加圆点 )。
网络学院:
* 新手上路
* 软件教室
* 设计教室
* 开发教室
如:
网络学院:
● 新手上路
● 软件教室
● 设计教室
● 开发教室
注意事项: 标示项目符号也可以用...标记,以符号字元 ( ○、◆、◎、?、■...等 ) 标示。 如 :
●
在html文件中,有些符号是代表特定的意义的。所以当我们要
使用这些特殊符号时,便要用替代指令。
第五课区段标记
一个网站不仅要内容丰富外,也要有美观简洁的版面。html所提供的区段标记功能,如果可以好好的利用也会有相当不错的效果。
产生水平线。
如:
跳下一行
: 太平洋网络学院,
网上学电脑的好去处。
太平洋网络学院,网上学电脑的好去处。
...
段落,跳下一行并加一行空白。 (
可省略 ) 如 : 太平洋网络学院,
网上学电脑的好去处。
太平洋网络学院, 网上学电脑的好去处。
...置中。
如 : 置中
置中
...不跳下一行。
如 : 太平洋网络学院,
网上学电脑的好去处。
太平洋网络学院,网上学电脑的好去处。
...
以文件原始格式显示。
如 :
原始格式: 文件
原始格式: 文件
第六课链接
链接可说是html中最重要的功能!因为html拥有链接的功能,使你能接上internet、www ??享受多姿多彩的网络世界。
——链接至网络的某个url网址或文件,可参考考网络链接方式。
——链接html文件的某个区段。
网络链接方式 : //主机名称 / 路径 / 文件名称 网址 如 : http : //www.pconline.com.cn/ 文件传输
如 : ftp : //ftp.pconline.com.cn/ gropher 传输
如 : gropher : //gropher.net.cn/ 远端登入
如 :
如 : file : //data/html/file.zip net news 传输
如 : news : talk.hinet.net.cn e-mail
如 : mailto :[email protected]
设定基本url位置或路径,以後只要设定文件名称即会自动加上位置或路径。
链接的url位址或文件
指定链接到的url位址或文件显示于那一个视窗 ( 可和视窗标记配合使用或开新的视窗 )
如 :
href="kk.htm">■
target=frame1> ...
链接的url位址或文件
名称
指定链接到的url位址或文件显示于那一个视窗 ( 可和视窗标记配合使用或开新的视窗 )
如 : 外部链接 ■ 第六课链接
文件 a 点 ) ■ ( html文件 a 点 ) ·ch2.htm文件 ■ (欲链接至ch1.htm 文件 a 点 ) " ■ " 表示链接点,可以是文字或图案。( 即游标移到时,会变成手指形状的地方 )
链接指令 ( 用于head区,设定css文件 )。
,可设定时间载入网页 ( 用于head区 )。
设定
回应表头资料内容 , 若是数字表示秒数
回应表头 , 若设定为refresh载入url设定 ·url html位置
·设定十秒回到首页。 ( 若不设定html文件位置则再载入原html文件 )
设定链接、未链接部份颜色,用标记。
·
按下链接部份未放开时颜色
未看过的链接部份颜色
已看过的链接部份颜色
如 : 第八课设置图片
图片增加了网站版面的美观,不过也不要放了大量的图片,而拖慢网站传输的效率
标记。
如 : ...或
bgcolor=#000000>...
标记。
标记。
调整
提示字
边框
高度
文件或url位址
地图名称
宽度
如 : 可插入图片 ( gif、jpg格式 )、电影
[太平洋网络学院] ...
名称 设定地图动作区域
设定动作区域座标 ( 左上角座标 : x1,y1 右下角座标 : x2,y2 )
动作区域连结点 ( 可载入位址或文件 )
动作区域连结点不动作
外型
usemap=#a>
coords=0,200,200,300 href=3.htm>
html不仅能插入图片,也可以载入音乐、音效喔!
背景音乐、音效。
循环 , 背景音乐播放次数
文件或位址 (可为格
式 ) 如 : 内嵌音乐插件 ...内嵌插件。
height:高度
( 可设百分比% )
设定内嵌物件的位址
循环 , 背景音乐播放次数
自动播放
例 :
第十课滚动条
这是由ie提供的滚动条,可不要被众多的属性吓到了,越多的属性功能越强喔!
【文字卷动标记】 文字卷动 ( 滚动条 )。
【相关属性】
= 设定卷动方式
交替来回卷动
卷动 ( 预设 )
滑动
设定卷动方向
高度
循环,卷动次数 ( 预设循环 )
设定卷动距离
设定卷动时间
设定卷动速度 宽度 ( 可设百分比% )
【举例】 如 :
scrollamout=10 scrolldelay=100>太平洋网络学院
如 :
scrolldelay=300>太平洋网络学院
称为 html 的标签,以双标签的形式出现,所谓双标签,也就是有一个
就有一个对应的
与之对应,同样适
用于其他的双标签。 一般标签都为双标签。标签最终所显示的网页效果由各个属性来表达,属性可选择使用,不一定全部都用。在整个图片或帖子里双标签以首尾呼应的方式出现。
背景图片地址:" border=0 cellpadding=0 cellspacing=0 bordercolor=#0000ff width="100%">
这里是图片,文字或帖子内容.
bordercolordark="#00ffff">
表格宽度,接受绝对值(如)及相对值(width=80%)。
表格边框的厚度,不同浏览器有不同的内定值。 表格的摆放位置(水平),可选值为: (居左),
(居右),
(居中)
表格内内容的对齐方式(垂直),可选值为: (上对齐),(居中对齐),(下、底部对齐)。
表格的背景图片,与不要同用。
表格的背景颜色,与 background 不要同用。
表格边框颜色
表格边框向光部分的颜色(上、左)。
表格边框背光部分的颜色(右、下)。
或时将会失效。
和高度的值根据需要自定
称图形标记,主要用来插入图形标记。
插入文字
表示字体居中,可选值为居左()、居中(center)、 居右(right)
颜色代码
字体。常用字体为:宋体、黑体、楷体、仿宋、幼圆、新宋体、.细明体等。
字体大小,这里的最大值为7 取值越大文字就越大
设定档案及路径,可以是相对或绝对。
是否在音乐档下载完之后就自动播放。 是,否 (内定值)。
是否自动反复播放。
是,否。 表示重复两次, 是否完全隐藏控制画面,
为是,为否 (内定)。
设定歌曲开始播放的时间。如表示从第30秒处开始播放。
设定音量的大小,数值是0到100之间。内定为使用系统本身的设定
和 设定控制面板的高度和宽度。(若 hidden="no")
设定控制面板和旁边文字的对齐方式,其值可以是 top、bottom、
、baseline、 left、right、texttop、middle、absmiddle、
设定控制面板的外观。预设值是。
一般正常面板 较小的面板
只显示播放按钮
只显示暂停按钮
只显示停止按钮
只显示音量调节按钮
autostart=true loop=true>
HTML>
我的页面
网页的内容.......
当你点开任何网页的源文件的时候,相信都可以在长长的字符中寻找到上面这些单词,或者你现在把上面这些单词复制到你新建的文档文件中,保存之后把后缀名改成.html,一个网页就诞生了。这就是HTML语言,它不象C++,VB等等程序语言要你摸不清头脑,HTML语言只是一个在SGML定义下的描述性语言,或者说是标识语言。既然是标识语言,我们就从标识开始进行学习好了,也许当你完全掌握标识之后,就会发现基本上已经明白什么是HTML了。 a、任何标识都应该写在之间,如
b、标识的字母没有大小写的区分。
c、在起始标识中加入就是终止标识,一般情况下有起始表示就有终止标识。例如...
d、有的标识需要加入参数,有的不必,需要注意的是这些参数只能加在起始标识中。
现在我们开始认识第一类标识:
事实上你已经见过了这些标识,就是开头,
这是HTML文件的开头部分,相应的
就是本文部分,开头部分主要是用来记载关于这个页面的一些重要资讯,所以呢大部分的标记都将在本文部分进行应用。
这里的文字就成了你所建立页面的标题,你可以更改一下例1-1中非标记部分。这些标记就构成了HTML的基本构架,其中只有具有参数设定。我们就通过一个例子来认识: 设定一般文字连结颜色。
设定刚按下时文字连结颜色。
设定连结后的颜色。(被按过)。
设定背景墙纸。
设定背景颜色。
设定整份文件显示画面的左方边沿空间,单位为像素。
设定整份文件显示画面的上方边沿空间。
固定背景墙纸,当卷动文字时墙纸不会跟著卷动。
这里需要说明的是色彩的问题,色彩是用 16 进制的红-绿-蓝值来表示的,所以一个颜色也就由RRGGBB的格式构成,而16 进制的数码有:
0,1,2,3,4,5,6,7,8,9,a,b,c,d,e,f. #000000, 其中红=00,蓝=00,绿=00,
色彩即为黑色 #0000FF,其中红=00,绿=00,蓝=ff,色彩即为蓝色 如果你想深入了解色彩的问题,你可以查看诸如FLASH等等软件的色彩表。
这两个标识都是用于控制字体的大小,色彩,字体, 但是 可以用于之间,控制全文的文字;
只应用于选择范围中的文字
两个标识出现在一个 html 文件中的时候,没有被选择的文字才会受到的影响。下面我们就来看一个例子:
H.S Workshop
face="Arial" size="7" color="#000000"> 欢迎来到H.S
Workshop [例2-1]
我们看到告诉 IE全文用7号黑色Arial字体显示,但H.S Workshop被我们用围住了,所以执行的设定。这里有face=、size=、color= 三个参数可以进行设定。 设定字体。
设定字体大小,这里需要注意的是和值,我们在例2-1中,把的size的值改成"-2"你会发现效果是
一样的,相应的把的size值改成其他任何小于7的数值,
设定文字色彩. 这里我们还发现了一个问题,HTML的空标识,因为我们看到没有存在的意义,所以可以忽略,当然如果你在后面添加对整个html文件也没有影响。其他的我们就称之为围堵标识。
这是一个标题标识,从1到6替减,是一个围堵标识,我们需要注意的是这个标识独占一行并自动插入一个空行,你可以自己尝试一下,这里就不举例说明了。 这是对文字进行一些特殊处理的标识,我们就来看看他们的效果来进行学习好了 :
标识意
文字特殊处理的标识
义
欢迎来到H.S Workshop
欢迎来到H.S
欢迎来到H.S Workshop
Workshop 欢迎来到H.S Workshop 文字效果
欢迎来到H.S Workshop
欢迎来到H.S Workshop
欢迎来到H.S Workshop
欢迎来到H.S Workshop
欢迎来到H.S Workshop
欢迎来到H.S Workshop
欢迎来到H.S Workshop
欢迎来到H.S Workshop
欢迎来到H.S Workshop
P欢迎来到H.S Workshop
P欢迎来到H.S Workshop
欢迎来到H.S Workshop
欢迎来到H.S Workshop
欢迎来到H.S Workshop
欢迎来到H.S Workshop
欢迎来到H.S Workshop
欢迎来到H.S
欢迎来到H.S Workshop 欢迎来到H.S Workshop 欢迎来到H.S Workshop 欢迎来到H.S Workshop 欢迎来到H.S Workshop 欢迎来到H.S Workshop欢迎来到H.S Workshop P欢迎来到H.S Workshop P欢迎来到H.S Workshop 欢迎来到H.S Workshop 欢迎来到H.S Workshop 欢迎来到H.S Worksho p 欢迎来到H.S Workshop 欢迎来到H.S Workshop 欢迎来到H.S Workshop
Workshop
你是否已经了解了呢,这些就是HTML实现字体特殊效果的标识,唯一特别的是,可以不用插入换行。
我们已经认识了文字标识,为了让整个网页更清晰美观,我们就不可以少了排版标识。 现在比较讲知识产权,我们就先来看看如何告诉别人这是你的产权好了,
HTML和其他的程序语言一样,可以在代码中添加注释,来告诉别人这里开始写的是什么,当然这也是告诉自己,方便以后的管理,不过,这只存在于你的原代码中,不会在浏览器中发生任何影响。
现在我们开始认识对段落控制的标识: 我们可以把他看做一个空行标识,既在网页中显示一段空白行。
一般在DW或者FG等网页编辑工具中,回车即在HTML插入一个
,这也是一个空标记,他的常用参数
是 align="#"(#=right, left,center) 分别表示左对齐,右对齐,居中。默认值为 left.。
H.S Wrokshop
H.S Wrokshop
H.S Workshop 效果如下:
H.S Wrokshop
H.S Wrokshop
H.S Wrokshop
H.S Workshop
这两个标记分别表示换行和不换行,前者使网页中的元素直接在下一行,不插入空行,后者则表示不换行,对于一些必须在一行中显示的文字,对电话号码等等的显示比较有用。 这里的是个空标识,是围堵标识。需要注意的是在中没有意义。这时候我们就要通过一个另一个标识来实现对齐效果,
....
。
这个标识有它更广泛的用途,在这里只简单的提一下其中的对齐参数运用。下面我们就来看一个简单的例子:
H.S Workshop H.S Workshop
H.S Workshop H.S Workshop H.S Workshop H.S Workshop H.S Workshop H.S Workshop H.S Workshop
H.S Workshop
H.S Workshop
H.S Workshop
H.S Workshop H.S Workshop H.S Workshop H.S Workshop H.S Workshop H.S Workshop H.S WorkshopH.S Workshop H.S Workshop
H.S Workshop
现在我们把的三个值提出来,发现他们其实自身也是标识,它们可以对单个,单行文字进行围堵,实现他的效果,这样又多了一个途径实现的对齐效果了,具体的你可以自行尝试一下,注意,他们可是围堵标识哦。
这里把它从换行中分出来,是想大家于对比一下,这是个建议折行的标识,当用户的分辨率无法完整的显示出一段文字的时候,你就可以插入这个标识,这时候就会发生与同样的效
果,如果达到了条件则没有效果产生,你可以自己尝试一下,它是一个空标识。
接着我们来看看HTML两个在排版上非常使用的标识。 预格式化文本标识,他们允许你在HTML原文件里输入空白,并显示出和你在HTML编辑的一模一样的格式,区别就在
显示出来的是设定好了的字体大小,
显示小于设定的一号字体,
则在的基础上把 html 里的标识也显示出来。
例:
Please use your card. VISA Master
Here is an order form.
* Fax
* Air Mail
Please use your card. VISA Master
Here is an order form.
Fax Air Mail
Please use your card. VISA Master
Here is an order form.
* Fax
* Air Mail
Please use your card. VISA Master
Here is an order form.
Fax Air Mail
Please use your card. VISA Master
Here is an order form.
* Fax
* Air Mail
Please use your card. VISA Master b Here is an order form.
b
* Fax
* Air Mail
比较一下上面三者的效果。
今天的最后一个标识称为水平线。顾名思义,它实现插入一条水平线的效果。
。
设定线条置放位置,可选择:三种设定值。
设定线条厚度,以像素作单位.
设定线条长度,可以是绝对值(以像素作单位)或相对值,默认值为 100%。
设定线条颜色,内定为黑色.
设定线条为平面显示,若删去则具阴影或立体,这是默认值。
图形对于一个网页来说其占的位置尽次于文字所占的比重,我们同过这个标识在网页中加入一张图片做到图文并茂,它
导入图片的途径。
设定图象显示的大小,以象素为单位,不过一般情况下为了保持页面的美观,我们使用真实的大小为佳,通过专业的图形编辑工具来编辑图形的大小。
设定图象边框的大小,单位也是象素,它可以是任何数值,在现代网页编辑中通常取值为1。
设定图象边缘的空白数,设定左右,vspace设定上下,这样可以确保其他元素与图片的距离。 控制文字的位置,默认值为 botom。
在图片显示的位置插入一段文字,当图片还没有被读取或这浏览者使用的是文字游览器的时候,这段文字就会显示出来。 同样在显示 src 所显示的图片之前先显示出一张图片,条件也是在 src 还没有被读取的时候,一般我们用于显示原图片的缩略图,使浏览者不会因为图片读取慢而失去浏览的兴趣。 关于表格的标识: 首先我们必须建立一个表格,我们可以通过
这个围堵标识来实现。这个标识的作用就好象告诉浏览器开始处理HTML文件一样,它告诉浏览器现在开始处理表格,其他所有的表格标识都必须写在
里面。
关于它的参数比较多,我们现在一个个来看它有什么作用。
设定表格的宽度,一般来说在这层我们只需要指定一个表格的宽度就可以了。这个值可以是绝对的也可以是相对的。 设定表格边框的厚度,当取值为0时或者不用这个参数的时候,表格就不在浏览器中显示出来,但表格中的元素仍然是按表格排列。
表格线的厚度,为了和区别开来,我们看个例子
1
2
3
4
1
2
3
4
比较一下这两个例子,我们就可以很清晰的看到两个例子的不同.
文字和格线之间的距离,使文字看起来更清晰。
这个值在前面我们已经重复的介绍过了,这里是对表格的位置进行水平位置设定。
这是对表格垂直位置的设定.
导入表格的背景图片。
设定表格的背景颜色。
设定表格的边框颜色。(注意,当设定border=为0时,这个值无效)
设定表格边框向光部分的颜色. 设定表格边框背光部分的颜色.
表格栏位数目,只是让浏览器在下载表格是先画出整个表格而己.
显示边框,参数的含义是:
显示所有边框,
只显示上边框,
只显示下边框,
只显示上下边框,
只显示左右边框,
只显示左边框,
只显示右边框,
不显示任何边框.
显示分隔线,参数的含义依此是:
显示所有分隔线,
只显示组与组之间的分隔线,
只显示行与行之间的分隔线,
只显示列与列之间的分隔线,
不显示任何分隔线。
建立了一个表格区,接着我们就要把这个表格分开,那么就必须用到这个标识,一般我们添加多少个就表格就会分成多少行。一个表格的基本格式如下:
的参数设定:
bordercolorlight="" bordercolordark="">
有了行,就要开始设定单元格,单元格就是一个表格的最小单位。我们用过
来实现。在
下面写入多少个
就会在这一行中显示出多少个单元格。
单元格参数设定:
windth="" 通过相对值或绝对值设定这个单元格的宽. height="" 通过相对值或绝对值设定这个单元格的高. colspan="" rowspan="" 例:
cellpadding="2" align="CENTER">
第一行第一栏
第一行之第二栏及第三栏
第二行及第三行之第一栏
第二行第二栏
第二行第三栏
第三行第二栏
第三行第三栏
效果如下:
(HyperText MarkUp Language)是使用特殊标记来描述文档结构和表现形式的一种语言,由W3C (World Wide Web Consortium) 所制定和更新。我们可以用任何一种文本编译起来编辑HTML文件,因为它就是一总纯文本文件。 下面我们来看一小段HTML语言的代
码,来了解HTML语言的基本结构:
HTML(HyperText MarkUp Language)是使用特殊标记来描述文档结构和表现形式的一种语言。将这一小段代码粘贴至文本文件中,然后选择“另存为”,将文件的后缀名改为.htm或者.html即可,然后在所在的目录下就可看到一个IE的图标,名字就是你所存的文件名称。这是声明HTML文件的语法格式。每一个HTML文件,都必须以开头,以结束这是文件头声明的语法格式。在这
之内的所有文字都属于文件的文件头,并不属于文件本体。 这是声明文件标题的语法格式。在这之中写下的所有内容,都将写在网页最上面的标题栏中。这是声明文件主体的语法格式。在这之间写下的内容都是文件的主体,也就是说将会被显示在客户区之中。 注意:几乎每一种HTML语言的语法都是以开头,以结
束。
在编辑HTML语言过程中,也可以使用注释。语法格式为:文件注释->。就好像C语言中的 /* …… …… */ 一样,中间的内容
只是解释说明,并不被编译器所编译。
长度单位可以用来定义水平线、表格边匡、图像等对象的长、宽、高等一系列属性,同时也可以用来定义这些对象在页面上的位置
等属性,用来描述页面上可能遇到的各种长度。
长度的表示方法有两种:绝对长度和相对长度。他们的单位都是像素 (pixel)(用px表示)和百分比(%),像素代表的是屏幕上的每个点,而百分比代表的是相对于客户区的多少。下面我们就以水平
线的宽度为例,说明这两种表示方法。
HTML语言的长度表示
HTML(HyperText MarkUp Language)是使用特殊标记来
描述文档结构和表现形式的一种语言。
在文本编译器中编译,改变网页的大小,就会看到这两者表示
长度方法的不同。
其中标记是在页面上建立水平线的标记。
是水平线元素中的一种属性,用来表示水平线的宽度。
这里即表示这个水平线的宽度是500像素;即表示水平线占据客户区的总宽度的%50。
和长度单位一样,颜色单位也是描述页面表现形式的一种很重
要的的数据类型。颜色单位有三种表示方法:
这三种表示方法不同,但是效果却是一样的。下面用一小段代
码说明这三种颜色的表示方法:
HTML语言中颜色的不同表示方法
静夜思
英文>
窗前明月光
进制颜色代码>
疑是地上霜
十进制RGB码>
举头望明月
进制颜色代码>
低头思故乡
颜色代码>
本文件在保存时请选择字符型进行保存。 。16进制颜色代码之前必须有一个“#”号,这种颜色代码是由三部分组成的,其中前两位代表红色,中间两位代表绿色,后两位代表蓝色。不同的取值代表
不同的颜色,他们的取值范围是00--FF。
语法格式:。在这种表示法中,后面三个参数分别是红色、绿色、蓝色,他们的取值范围是0--255。以上两种表达方式可以相互转换,标准是16进制与10
进制的相互转换。
可以在代码中直接写出颜色的英文名称。
以上三种表示方法的效果相同,一般16进制颜色代码的表示方法比较常用。读者可以根据自己的喜好和实际情况来决定使用哪一种
表示方法。关于不同颜色的定义,请查看相关资料。。
路径是一种互联网地址的表示法。在这个数据里可以包括以何种协议连接、要连接到哪一个地址、连接地址的端口 (Port) 号以及服务器(Server)
里文件的完整路径和文件名称等信息。
在HTML中,URL路径分为两种形式:绝对路经和相对路径。 绝对路径是将服务器上磁盘驱动器名称和完整的伦够写出来,同时也会表现出磁盘上的目录结构。 语法格
式:
:
其中,是某一种传输协议,而则是连接的位置信息。 例
如:
相对路径是相对于当前的HTML文档所在目录或站点根目录的路径。 语法格式: 相对关系 / 部分路径
根据相对路径的参照点又可以分为相对文档的相对路径以及相
对根目录的相对路径。
相对文档: 这种路径的表现形式是根据目标文档所在目录和当前文档所在目录之间的关系的一种表现形式。“../”表示上一级目录,没有“../”表示当前目录。 例如当前文档的路径是:。我们要找test目录下的html.htm 。而当前的目录是project1,我们要回到上一级目录中,所以路径是
“../html.htm”。
相对根目录: 这种路径根据目标文档相对于根目录的关系的一种表现形式。在这种表达式种的第一个字符是“/”,这个符号表示这个路径是一个相对于根目录的表达式。 例如:
这一课介绍文档中部分的基本使用方
法。 head这一部分是由标记开始,以标记结束,是html文档的首要部分。下面我们看一下head部分所包含的元素:
元素
title 描述 文档标题
meta 描述非html标准的一些文档信息
link 描述当前文档与其他文档之间的连接关系
base 定义体试时默认的外部资源
script 脚本程序内容
style 样式表内容 下面简要介绍一下各个部分的功能及用法:
文档标题 title包含的内容将会被显示在浏览器窗口的标题栏中。给自己的网页起一个适当的名字,可以体现出一些自己的个性。 语法格式: …… …… 在省略号处加入
的文字或符号,都将显示在浏览器的标题栏中。
描述非html标准的一些文档信息 meta元素提供的
信息是用户不可见的。下面是meta的几种用法:
定义搜索关键字: 这里介绍两种基本的用法:
="html,css,javascript">
这样一来,在你的网页中就会体现出这样的信息。但是这些信
息是不可见的,只是提供给那些搜索引擎使用。
控制页面缓存: 浏览器一般为了节约时间,都在本地硬盘上保存一个网上的文件作为临时版本。在用户下次打开这个网页的时候,浏览器将会直接调用硬盘上的这个版本,而不是网上的。如果想让浏览者每次打开网页的时候都是看到的最新版本,那么就在网页上
加上这一句吧!
我们可以通过这样的
语句设定语言的编码方式。这样,浏览器就可以为我们正确的选择语
言,不需要我们来选取。
上面的例子显示的就是简体中文,如果想要显示繁体中文,将
GB3212替换为BIG5就可以了。
http-equiv="refresh"content="60",URL="new.htm"> 这样的语句可以让我们的浏览器按照content属性中制定的时间来跳转到
URL属性中设定的URL地址。
上面的例子就是在打开页面60秒后调用一个新的页面new.htm。如果没有能够找到new.htm,浏览器就﹞执行刷新本页的操作。这也
是大多数聊天室的设定方法。
描述当前文档与其他文档之间的连接关系 这个元素用来指定当前文档和其他文档之间的联接关系。 语法格式:
rel="描述" href="URL地址">
说明两个文档之间的关系;
说明目标文档名。
以下是一个指定外联样式表文件的例子:
rel="stylesheet" href="style.css"> 关于css层叠样式表,请查
阅有关资料。
定义体试时默认的外部资源 用于定义文档提交是默认的外部资源。 语法格式:
窗口名称">
指定文档中链接到的所有文件默认的URL地址。在这里指定href的属性,所有的相对卢劲的前面都会加上href属性中
的值。
指定文档中所有链接的默认打开窗口。最常见的应用是在框架页中。我们要把Menu框架中的联接显示到
content框架中,就可以在Menu的网页中加上。这样,就省去了在Menu网页上所有链接的
属性上加上target属性了。
脚本程序内容 标记用来在页面中加入脚本程序。 语法格式: 在language中一定要指定脚本语言的种类。如VBScript等。 样式表内容 用来指定当前文档的css层叠样式表。css对于网页的字体样式、背景、边界等都有很大的应用。详细部分请大
家参阅css有关内容。
大家从各大门户网站的主页上就可以看出,部分占据了大部分的代码。可见body是一个网页代码的绝对主要部分。body是由开始,由结束。下面我们看一下body部分的元
素:
元素
bgcolor 描述 背景色
background
text
link
alink
vlink
leftmargin
topmargin 背景图案 文本颜色 链接文字颜色 活动链接文字颜色 已访问链接文字颜色 页面左侧的留白距离 页面顶部的留白距离
下面介绍各个部分的功能及用法:
背景色 用于指定页面的背景颜色。在Microsoft公司的IE浏览器中,默认情况下是白色,Netscape公司的Navigator浏览器的默认情况是灰色。语法格式: 背景图案background 属性用于指定页面的背
景图案。语法格式:
下面是几种文字的属性,可以改变文字的颜色,以及在页面上留出空白:text, link, alink, vlink, leftmargin, topmargin
文本颜色即非链接文字的颜色;
链接文字颜色即可连接文字的颜色;
活动链接文字颜色即正被点击的可链接文字的颜色; 已访问链接文字颜色即已被点击的可链接的文字的颜色;
页面左侧的留白距离;
页面顶部的留白距离。
语法格式: 示例:
body元素示例
这里显示body的示例。
这样的属性,大多数html的页面已经不使用这样的用法了。现在多数是在head中加入相应的代码。要达到的效果是鼠标放到有链接的字体上时,字体变色,点击后字体变为灰色。具体方法如下: A:link {color:#00007f;} A:visited {color:#65038e;} A:active
{color:#ff0000;} A:hover {color:#ff0000;}
将这段代码加入到head中,在body中加入有链接的文字,就可以看出效果了。这一部分是属于css中的知识。在body中加入有链接的文字:在Dreamweaver中,选定文字后,在下面的Properties中的link中加入想要链接到的页面的地址。在FrontPage中,选定
文字后,点击右键就会有相应的选项。
第一课基础
Html 是英文 HyperText Markup Language 的缩写,中文意思是“超文本标志语言”,用它编写的文件(文档)的扩展名是.html或.htm,它们是可供浏览器解释浏览的文件格式。您可以使用记事本、写字板或 FrontPage Editor 等编辑工具来编写Html文件。Html语言使用标志对的方法编写文件,既简单又方便,它通常使用来表示标志的开始和结束(例如标志对),
因此在Html文档中这样的标志对都必须是成对使用的。
当我们畅游Internet时,我们透过浏览器所看到的网站,是由HTML (HyperText Markup Language) 语言所构成。HTML ( 超文件标记语言 ) (Tag),将影像、声音、图片、文字等连结显示出来。 HTML标记是由所括住的指令,主要分为:单标记指令(只有,没有)、双标记指令 ( 由,所构成 ) 。HTML网页文件可由任何文本编辑器或网页专用编辑器编辑,完成后 ( 以 .htm 或 .html 为文件后缀保存 ) 将HTML网页文件由浏览器打开显示,若测试没有问题则可以放到
服务器 (Server) 上,对外发布信息。
标头区开始
...标题区
标头区结束
本文区开始
本文区结束 文件结束
标头区 : 记录文件基本资料,如作者、编写时间。 标题区 : 文件标题须使用在标头区内,可以在浏览器最
上面
本文区 : 文件资料,即在浏览器上看到的网站内容。 通常一份HTML网页文件包含二个部份: 标头区、 本文区。而
代表网页文件格式。
习惯上一个网站的首页名称通常订为 index.htm 或 index.html 这样只要浏览网站,浏览器便会自动的找出 index.htm
文件。
第二课字体
设定标题字体大小, n = 1 ( 大 ) ~ 6 ( 小 ) 会自动跳下一行。通常用在如章节、段落等标题上。
如:
如 :
如:粗体字 粗体字
如:斜体字 斜体字
如:横线
如:打字体 打字体
...上标字
如:字体上标字字体上标字
如:字体下标字字体下标字
如:
第三课表格
表格是html的一项非常重要功能,利用其多种属性能够设计出多样化的表格。使用表格可以使你的页面有很多意想不到的效果,使
页面更加整齐美观。
表格指令
相关属性: ·
调整
背景颜色
边框
高度
宽度 表格标题
相关属性: align:调整 表格列 (
可省略 ) 。
相关属性:align:调整 表格栏标题 ( 表头 ) 粗体字 (
可省略 ) 。
相关属性:
调整
栏宽
栏高 表格栏资料 ( 储存格 ) (
可省略 ) 。
相关属性:
调整
背景颜色
高度
宽度
栏宽
栏高
举例 如:( 基础型 )
太平洋网络学院
太平洋网络学院 太平洋网络学院
太平洋网络学院
太平洋网络学院 太平洋网络学院 太平洋网络学院 太
平洋网络学院
如:( 加强型 ) 增加背景颜色、表格标题、栏标题、跨
栏宽、跨栏高。
表格标题
行标题 1
行标题 2
列标题 1
a
a
a
a
b
b
b
b
列标题 2
c
c
c
c
d
d
d
d
第四课标示
提供许多种类的标示标记,作项目标示,而且可以作巢状式标
示!
标示项目。 如:
* 第一项
* 第二项
1. 第一项 2. 第二项
,可标示数字或英文、罗马字母。 如:
* 第一项
* 第二项
i. 第一项 ii. 第二项
,可标示数字或英文、罗马字母。 如:
* 第一项
* 第二项
? 第一项 ? 第二项
定义项目。
定义资料。
...
。 如:
十进制:
0、1、2、3、4、5、6、7、8、9 十六进制:
0、1、
2、3、4、5、6、7、8、9、a、b、c、d、e、f
十进制: 0、1、2、3、4、5、6、7、8、9 十六进制:
0、1、2、3、4、5、6、7、8、9、a、b、c、d、e、f
巢状式标示如 :
* 第一章
* 第一节
* 第一段
* 第二段
* 第二节
* 第二章
* 第三章
1. 第一章
i. 第一节
第一段
第二段
ii. 第二节
2. 第二章
3. 第三章
( 自动加圆点 )。
网络学院:
* 新手上路
* 软件教室
* 设计教室
* 开发教室
如:
网络学院:
● 新手上路
● 软件教室
● 设计教室
● 开发教室
注意事项: 标示项目符号也可以用...标记,以符号字元 ( ○、◆、◎、?、■...等 ) 标示。 如 :
●
在html文件中,有些符号是代表特定的意义的。所以当我们要
使用这些特殊符号时,便要用替代指令。
第五课区段标记
一个网站不仅要内容丰富外,也要有美观简洁的版面。html所提供的区段标记功能,如果可以好好的利用也会有相当不错的效果。
产生水平线。
如:
跳下一行
: 太平洋网络学院,
网上学电脑的好去处。
太平洋网络学院,网上学电脑的好去处。
...
段落,跳下一行并加一行空白。 (
可省略 ) 如 : 太平洋网络学院,
网上学电脑的好去处。
太平洋网络学院, 网上学电脑的好去处。
...置中。
如 : 置中
置中
...不跳下一行。
如 : 太平洋网络学院,
网上学电脑的好去处。
太平洋网络学院,网上学电脑的好去处。
...
以文件原始格式显示。
如 :
原始格式: 文件
原始格式: 文件
第六课链接
链接可说是html中最重要的功能!因为html拥有链接的功能,使你能接上internet、www ??享受多姿多彩的网络世界。
——链接至网络的某个url网址或文件,可参考考网络链接方式。
——链接html文件的某个区段。
网络链接方式 : //主机名称 / 路径 / 文件名称 网址 如 : http : //www.pconline.com.cn/ 文件传输
如 : ftp : //ftp.pconline.com.cn/ gropher 传输
如 : gropher : //gropher.net.cn/ 远端登入
如 :
如 : file : //data/html/file.zip net news 传输
如 : news : talk.hinet.net.cn e-mail
如 : mailto :[email protected]
设定基本url位置或路径,以後只要设定文件名称即会自动加上位置或路径。
链接的url位址或文件
指定链接到的url位址或文件显示于那一个视窗 ( 可和视窗标记配合使用或开新的视窗 )
如 :
href="kk.htm">■
target=frame1> ...
链接的url位址或文件
名称
指定链接到的url位址或文件显示于那一个视窗 ( 可和视窗标记配合使用或开新的视窗 )
如 : 外部链接 ■ 第六课链接
文件 a 点 ) ■ ( html文件 a 点 ) ·ch2.htm文件 ■ (欲链接至ch1.htm 文件 a 点 ) " ■ " 表示链接点,可以是文字或图案。( 即游标移到时,会变成手指形状的地方 )
链接指令 ( 用于head区,设定css文件 )。
,可设定时间载入网页 ( 用于head区 )。
设定
回应表头资料内容 , 若是数字表示秒数
回应表头 , 若设定为refresh载入url设定 ·url html位置
·设定十秒回到首页。 ( 若不设定html文件位置则再载入原html文件 )
设定链接、未链接部份颜色,用标记。
·
按下链接部份未放开时颜色
未看过的链接部份颜色
已看过的链接部份颜色
如 : 第八课设置图片
图片增加了网站版面的美观,不过也不要放了大量的图片,而拖慢网站传输的效率
标记。
如 : ...或
bgcolor=#000000>...
标记。
标记。
调整
提示字
边框
高度
文件或url位址
地图名称
宽度
如 : 可插入图片 ( gif、jpg格式 )、电影
[太平洋网络学院] ...
名称 设定地图动作区域
设定动作区域座标 ( 左上角座标 : x1,y1 右下角座标 : x2,y2 )
动作区域连结点 ( 可载入位址或文件 )
动作区域连结点不动作
外型
usemap=#a>
coords=0,200,200,300 href=3.htm>
html不仅能插入图片,也可以载入音乐、音效喔!
背景音乐、音效。
循环 , 背景音乐播放次数
文件或位址 (可为格
式 ) 如 : 内嵌音乐插件 ...内嵌插件。
height:高度
( 可设百分比% )
设定内嵌物件的位址
循环 , 背景音乐播放次数
自动播放
例 :
第十课滚动条
这是由ie提供的滚动条,可不要被众多的属性吓到了,越多的属性功能越强喔!
【文字卷动标记】 文字卷动 ( 滚动条 )。
【相关属性】
= 设定卷动方式
交替来回卷动
卷动 ( 预设 )
滑动
设定卷动方向
高度
循环,卷动次数 ( 预设循环 )
设定卷动距离
设定卷动时间
设定卷动速度 宽度 ( 可设百分比% )
【举例】 如 :
scrollamout=10 scrolldelay=100>太平洋网络学院
如 :
scrolldelay=300>太平洋网络学院
称为 html 的标签,以双标签的形式出现,所谓双标签,也就是有一个
就有一个对应的
与之对应,同样适
用于其他的双标签。 一般标签都为双标签。标签最终所显示的网页效果由各个属性来表达,属性可选择使用,不一定全部都用。在整个图片或帖子里双标签以首尾呼应的方式出现。
背景图片地址:" border=0 cellpadding=0 cellspacing=0 bordercolor=#0000ff width="100%">
这里是图片,文字或帖子内容.
bordercolordark="#00ffff">
表格宽度,接受绝对值(如)及相对值(width=80%)。
表格边框的厚度,不同浏览器有不同的内定值。 表格的摆放位置(水平),可选值为: (居左),
(居右),
(居中)
表格内内容的对齐方式(垂直),可选值为: (上对齐),(居中对齐),(下、底部对齐)。
表格的背景图片,与不要同用。
表格的背景颜色,与 background 不要同用。
表格边框颜色
表格边框向光部分的颜色(上、左)。
表格边框背光部分的颜色(右、下)。
或时将会失效。
和高度的值根据需要自定
称图形标记,主要用来插入图形标记。
插入文字
表示字体居中,可选值为居左()、居中(center)、 居右(right)
颜色代码
字体。常用字体为:宋体、黑体、楷体、仿宋、幼圆、新宋体、.细明体等。
字体大小,这里的最大值为7 取值越大文字就越大
设定档案及路径,可以是相对或绝对。
是否在音乐档下载完之后就自动播放。 是,否 (内定值)。
是否自动反复播放。
是,否。 表示重复两次, 是否完全隐藏控制画面,
为是,为否 (内定)。
设定歌曲开始播放的时间。如表示从第30秒处开始播放。
设定音量的大小,数值是0到100之间。内定为使用系统本身的设定
和 设定控制面板的高度和宽度。(若 hidden="no")
设定控制面板和旁边文字的对齐方式,其值可以是 top、bottom、
、baseline、 left、right、texttop、middle、absmiddle、
设定控制面板的外观。预设值是。
一般正常面板 较小的面板
只显示播放按钮
只显示暂停按钮
只显示停止按钮
只显示音量调节按钮
autostart=true loop=true>
HTML>
我的页面
网页的内容.......
当你点开任何网页的源文件的时候,相信都可以在长长的字符中寻找到上面这些单词,或者你现在把上面这些单词复制到你新建的文档文件中,保存之后把后缀名改成.html,一个网页就诞生了。这就是HTML语言,它不象C++,VB等等程序语言要你摸不清头脑,HTML语言只是一个在SGML定义下的描述性语言,或者说是标识语言。既然是标识语言,我们就从标识开始进行学习好了,也许当你完全掌握标识之后,就会发现基本上已经明白什么是HTML了。 a、任何标识都应该写在之间,如
b、标识的字母没有大小写的区分。
c、在起始标识中加入就是终止标识,一般情况下有起始表示就有终止标识。例如...
d、有的标识需要加入参数,有的不必,需要注意的是这些参数只能加在起始标识中。
现在我们开始认识第一类标识:
事实上你已经见过了这些标识,就是开头,
这是HTML文件的开头部分,相应的
就是本文部分,开头部分主要是用来记载关于这个页面的一些重要资讯,所以呢大部分的标记都将在本文部分进行应用。
这里的文字就成了你所建立页面的标题,你可以更改一下例1-1中非标记部分。这些标记就构成了HTML的基本构架,其中只有具有参数设定。我们就通过一个例子来认识: 设定一般文字连结颜色。
设定刚按下时文字连结颜色。
设定连结后的颜色。(被按过)。
设定背景墙纸。
设定背景颜色。
设定整份文件显示画面的左方边沿空间,单位为像素。
设定整份文件显示画面的上方边沿空间。
固定背景墙纸,当卷动文字时墙纸不会跟著卷动。
这里需要说明的是色彩的问题,色彩是用 16 进制的红-绿-蓝值来表示的,所以一个颜色也就由RRGGBB的格式构成,而16 进制的数码有:
0,1,2,3,4,5,6,7,8,9,a,b,c,d,e,f. #000000, 其中红=00,蓝=00,绿=00,
色彩即为黑色 #0000FF,其中红=00,绿=00,蓝=ff,色彩即为蓝色 如果你想深入了解色彩的问题,你可以查看诸如FLASH等等软件的色彩表。
这两个标识都是用于控制字体的大小,色彩,字体, 但是 可以用于之间,控制全文的文字;
只应用于选择范围中的文字
两个标识出现在一个 html 文件中的时候,没有被选择的文字才会受到的影响。下面我们就来看一个例子:
H.S Workshop
face="Arial" size="7" color="#000000"> 欢迎来到H.S
Workshop [例2-1]
我们看到告诉 IE全文用7号黑色Arial字体显示,但H.S Workshop被我们用围住了,所以执行的设定。这里有face=、size=、color= 三个参数可以进行设定。 设定字体。
设定字体大小,这里需要注意的是和值,我们在例2-1中,把的size的值改成"-2"你会发现效果是
一样的,相应的把的size值改成其他任何小于7的数值,
设定文字色彩. 这里我们还发现了一个问题,HTML的空标识,因为我们看到没有存在的意义,所以可以忽略,当然如果你在后面添加对整个html文件也没有影响。其他的我们就称之为围堵标识。
这是一个标题标识,从1到6替减,是一个围堵标识,我们需要注意的是这个标识独占一行并自动插入一个空行,你可以自己尝试一下,这里就不举例说明了。 这是对文字进行一些特殊处理的标识,我们就来看看他们的效果来进行学习好了 :
标识意
文字特殊处理的标识
义
欢迎来到H.S Workshop
欢迎来到H.S
欢迎来到H.S Workshop
Workshop 欢迎来到H.S Workshop 文字效果
欢迎来到H.S Workshop
欢迎来到H.S Workshop
欢迎来到H.S Workshop
欢迎来到H.S Workshop
欢迎来到H.S Workshop
欢迎来到H.S Workshop
欢迎来到H.S Workshop
欢迎来到H.S Workshop
欢迎来到H.S Workshop
P欢迎来到H.S Workshop
P欢迎来到H.S Workshop
欢迎来到H.S Workshop
欢迎来到H.S Workshop
欢迎来到H.S Workshop
欢迎来到H.S Workshop
欢迎来到H.S Workshop
欢迎来到H.S
欢迎来到H.S Workshop 欢迎来到H.S Workshop 欢迎来到H.S Workshop 欢迎来到H.S Workshop 欢迎来到H.S Workshop 欢迎来到H.S Workshop欢迎来到H.S Workshop P欢迎来到H.S Workshop P欢迎来到H.S Workshop 欢迎来到H.S Workshop 欢迎来到H.S Workshop 欢迎来到H.S Worksho p 欢迎来到H.S Workshop 欢迎来到H.S Workshop 欢迎来到H.S Workshop
Workshop
你是否已经了解了呢,这些就是HTML实现字体特殊效果的标识,唯一特别的是,可以不用插入换行。
我们已经认识了文字标识,为了让整个网页更清晰美观,我们就不可以少了排版标识。 现在比较讲知识产权,我们就先来看看如何告诉别人这是你的产权好了,
HTML和其他的程序语言一样,可以在代码中添加注释,来告诉别人这里开始写的是什么,当然这也是告诉自己,方便以后的管理,不过,这只存在于你的原代码中,不会在浏览器中发生任何影响。
现在我们开始认识对段落控制的标识: 我们可以把他看做一个空行标识,既在网页中显示一段空白行。
一般在DW或者FG等网页编辑工具中,回车即在HTML插入一个
,这也是一个空标记,他的常用参数
是 align="#"(#=right, left,center) 分别表示左对齐,右对齐,居中。默认值为 left.。
H.S Wrokshop
H.S Wrokshop
H.S Workshop 效果如下:
H.S Wrokshop
H.S Wrokshop
H.S Wrokshop
H.S Workshop
这两个标记分别表示换行和不换行,前者使网页中的元素直接在下一行,不插入空行,后者则表示不换行,对于一些必须在一行中显示的文字,对电话号码等等的显示比较有用。 这里的是个空标识,是围堵标识。需要注意的是在中没有意义。这时候我们就要通过一个另一个标识来实现对齐效果,
....
。
这个标识有它更广泛的用途,在这里只简单的提一下其中的对齐参数运用。下面我们就来看一个简单的例子:
H.S Workshop H.S Workshop
H.S Workshop H.S Workshop H.S Workshop H.S Workshop H.S Workshop H.S Workshop H.S Workshop
H.S Workshop
H.S Workshop
H.S Workshop
H.S Workshop H.S Workshop H.S Workshop H.S Workshop H.S Workshop H.S Workshop H.S WorkshopH.S Workshop H.S Workshop
H.S Workshop
现在我们把的三个值提出来,发现他们其实自身也是标识,它们可以对单个,单行文字进行围堵,实现他的效果,这样又多了一个途径实现的对齐效果了,具体的你可以自行尝试一下,注意,他们可是围堵标识哦。
这里把它从换行中分出来,是想大家于对比一下,这是个建议折行的标识,当用户的分辨率无法完整的显示出一段文字的时候,你就可以插入这个标识,这时候就会发生与同样的效
果,如果达到了条件则没有效果产生,你可以自己尝试一下,它是一个空标识。
接着我们来看看HTML两个在排版上非常使用的标识。 预格式化文本标识,他们允许你在HTML原文件里输入空白,并显示出和你在HTML编辑的一模一样的格式,区别就在
显示出来的是设定好了的字体大小,
显示小于设定的一号字体,
则在的基础上把 html 里的标识也显示出来。
例:
Please use your card. VISA Master
Here is an order form.
* Fax
* Air Mail
Please use your card. VISA Master
Here is an order form.
Fax Air Mail
Please use your card. VISA Master
Here is an order form.
* Fax
* Air Mail
Please use your card. VISA Master
Here is an order form.
Fax Air Mail
Please use your card. VISA Master
Here is an order form.
* Fax
* Air Mail
Please use your card. VISA Master b Here is an order form.
b
* Fax
* Air Mail
比较一下上面三者的效果。
今天的最后一个标识称为水平线。顾名思义,它实现插入一条水平线的效果。
。
设定线条置放位置,可选择:三种设定值。
设定线条厚度,以像素作单位.
设定线条长度,可以是绝对值(以像素作单位)或相对值,默认值为 100%。
设定线条颜色,内定为黑色.
设定线条为平面显示,若删去则具阴影或立体,这是默认值。
图形对于一个网页来说其占的位置尽次于文字所占的比重,我们同过这个标识在网页中加入一张图片做到图文并茂,它
导入图片的途径。
设定图象显示的大小,以象素为单位,不过一般情况下为了保持页面的美观,我们使用真实的大小为佳,通过专业的图形编辑工具来编辑图形的大小。
设定图象边框的大小,单位也是象素,它可以是任何数值,在现代网页编辑中通常取值为1。
设定图象边缘的空白数,设定左右,vspace设定上下,这样可以确保其他元素与图片的距离。 控制文字的位置,默认值为 botom。
在图片显示的位置插入一段文字,当图片还没有被读取或这浏览者使用的是文字游览器的时候,这段文字就会显示出来。 同样在显示 src 所显示的图片之前先显示出一张图片,条件也是在 src 还没有被读取的时候,一般我们用于显示原图片的缩略图,使浏览者不会因为图片读取慢而失去浏览的兴趣。 关于表格的标识: 首先我们必须建立一个表格,我们可以通过
这个围堵标识来实现。这个标识的作用就好象告诉浏览器开始处理HTML文件一样,它告诉浏览器现在开始处理表格,其他所有的表格标识都必须写在
里面。
关于它的参数比较多,我们现在一个个来看它有什么作用。
设定表格的宽度,一般来说在这层我们只需要指定一个表格的宽度就可以了。这个值可以是绝对的也可以是相对的。 设定表格边框的厚度,当取值为0时或者不用这个参数的时候,表格就不在浏览器中显示出来,但表格中的元素仍然是按表格排列。
表格线的厚度,为了和区别开来,我们看个例子
1
2
3
4
1
2
3
4
比较一下这两个例子,我们就可以很清晰的看到两个例子的不同.
文字和格线之间的距离,使文字看起来更清晰。
这个值在前面我们已经重复的介绍过了,这里是对表格的位置进行水平位置设定。
这是对表格垂直位置的设定.
导入表格的背景图片。
设定表格的背景颜色。
设定表格的边框颜色。(注意,当设定border=为0时,这个值无效)
设定表格边框向光部分的颜色. 设定表格边框背光部分的颜色.
表格栏位数目,只是让浏览器在下载表格是先画出整个表格而己.
显示边框,参数的含义是:
显示所有边框,
只显示上边框,
只显示下边框,
只显示上下边框,
只显示左右边框,
只显示左边框,
只显示右边框,
不显示任何边框.
显示分隔线,参数的含义依此是:
显示所有分隔线,
只显示组与组之间的分隔线,
只显示行与行之间的分隔线,
只显示列与列之间的分隔线,
不显示任何分隔线。
建立了一个表格区,接着我们就要把这个表格分开,那么就必须用到这个标识,一般我们添加多少个就表格就会分成多少行。一个表格的基本格式如下:
的参数设定:
bordercolorlight="" bordercolordark="">
有了行,就要开始设定单元格,单元格就是一个表格的最小单位。我们用过
来实现。在
下面写入多少个
就会在这一行中显示出多少个单元格。
单元格参数设定:
windth="" 通过相对值或绝对值设定这个单元格的宽. height="" 通过相对值或绝对值设定这个单元格的高. colspan="" rowspan="" 例:
cellpadding="2" align="CENTER">
第一行第一栏
第一行之第二栏及第三栏
第二行及第三行之第一栏
第二行第二栏
第二行第三栏
第三行第二栏
第三行第三栏
效果如下: