[分享]HTML入门

lfspecter · 发表于 2005-1-10 21:49

多媒体效果

插入图形

　　超文本之所以在很短的时间内如此广泛的受到人们的青睐，很重要的一个原因时它能支持多媒体的特性，如图象、声音、动画等。这一部分，我们先来学习在一个页面中如何插入图象。

基本格式

超文本支持的图象格式一般有X Bitmap(XBM)、GIF、JPEG三种，所以我们对图片处理后要保存为这三种格式中的任何一种，这样才可以在浏览器中看到。　　插入图象的标签是<IMG>，其格式为：

<IMG SRC="图形文件地址">

　　SRC属性指明了所要链接的图象文件地址，这个图形文件可以是本地机器上的图形，也可以是位于远端主机上的图形。地址的表示方法可以沿用上一篇内容“文件的链接”中URL地址表示方法。

例：　<IMG SRC="images/ball.gif">

　　IMG还有两个属性是HEIGHT和WIDTH，分别表示图形的高和宽。通过这两个属性，可以改变图形的大小，如果没有设置，图形按原大显示：

图形与文字的对齐排列：

　　由IMG中的ALIGN属性来设置图文的对齐方式，有以下几种：

ALIGN=top	〈IMG SRC="love.gif" ALIGN=top>美丽的心灵	美丽的心灵
ALIGN=middle	〈IMG SRC="love.gif" ALIGN=middle>美丽的心灵	美丽的心灵
ALIGN=buttom	〈IMG SRC="love.gif" ALIGN=buttom>美丽的心灵	美丽的心灵
ALIGN=texttop	〈IMG SRC="love.gif" ALIGN=textop>美丽的心灵	美丽的心灵
ALIGN=baseline	〈IMG SRC="love.gif" ALIGN=baeline>美丽的心灵	美丽的心灵
ALIGN=left	〈IMG SRC="love.gif" ALIGN=left>美丽的心灵，有着数不清的爱心，象天空里的星星，明亮晶莹。	美丽的心灵，有着数不清的爱心，象天空里的星星，明亮晶莹。
ALIGN=right	〈IMG SRC="love.gif" ALIGN=right>美丽的心灵，有着数不清的爱心，象天空里的星星，明亮晶莹。	美丽的心灵，有着数不清的爱心，象天空里的星星，明亮晶莹。

图文之间的距离设置：

　　在HTML文件里图形水平位置的配置，可由HSPACE属性来完成，其垂直位置的配置，由VSPACE来完成。

<IMA　SRC="love.gif" >	美丽的心灵
<IMA　SRC="love.gif" HSPACE=30>	美丽的心灵
<IMA　SRC="love.gif" VSPACE=30>	美丽的心灵

图形按钮：

　　图形按钮就是使用者通过在图形上单击，就能连接到某个地址上去。很简单，我们只要调用一下前面的知识就可以完成了。其基本格式如下：

<A　HREF="资源地址"><IMG SRC="图形文件地址"></A>

例：

[此贴子已经被作者于2005-1-11 17:58:54编辑过]

lfspecter · 发表于 2005-1-10 21:50

播放音乐

HTML除了可以插入图形之外，还可以播放音乐和视频等。用浏览器可以播放的音乐格式有：MIDI音乐、WAV音乐、AU格式。另外在利用网络下载的各种音乐格式中，MP3是压缩率最高，音质最好的文件格式。

点播音乐

　　将音乐做成一个链接，只需用鼠标在上面单击，就可以听到动人的音乐了，这样做的方法很简单：

<A　HREF="音乐地址">乐曲名</A>

例如：播放一段MIDI音乐：

<A　HREF="midi.mid">MIDI音乐</A>　　MIDI音乐

　　　播放一段AU格式音乐：

<A　HREF="you.au">同桌的你-AU音乐</A>　　　　同桌的你-AU音乐

　　把我们喜欢的音乐收集起来，作成一个音乐库，随时都可以让自己和别人徜徉在音乐的海洋中，已经有人这样做了，你一定已经遇到很多，而且自己也可以试着去做了！

自动载入音乐

　　前面，我们是借助链接来实现网上播放音乐这一功能的，我们还可以让音乐自动载入，你可以让它出现控制面板或当背景音乐来使用。基本语法：

<EMBED SRC="音乐文件地址">

属性有：

SRC="FILENAME"	设定音乐文件的路径
AUTOSTART=TRUE/FALSE	是否要音乐文件传送完就自动播放，TRUE是要，FALSE是不要，默认为FALSE
LOOP=TRUE/FALSE	设定播放重复次数，LOOP=6表示重复6次，TRUE表示无限次播放，FALSE播放一次即停止。
STARTIME="分:秒"	设定乐曲的开始播放时间，如20秒后播放写为STARTIME=00:20
VOLUME=0-100	设定音量的大小。如果没设定的话，就用系统的音量。
WIDTH HEIGHT	设定控制面板的大小
HIDDEN=TRUE	隐藏控制面板
CONTROLS=CONSOLE/SMALLCONSOLE	设定控制面板的样子

例： *************************************

作为背景音乐来播放。 </body> </html>

例： *************************************

出现控制面板了，你可以控制它的开与关，还可以调节音量的大小。 <／body> </html>

IE中的背景音乐

　　另外，还有一种插入背景音乐格式，不过只有在IE浏览器中才可以听到。

　　 #=循环数

例：　　　　　　<bgsound src="sound.wav" loop=3>

[此贴子已经被作者于2005-1-11 17:59:42编辑过]

lfspecter · 发表于 2005-1-10 21:50

播放视频

用浏览器可以播放的格式有：MOV格式、AVI格式。

链接一个视频文件

　　将视频文件做成一个链接的方法：

<A　HREF=" 视频地址">视频名称</A>

例如：播放一段视频：

<A　HREF="welcome.avi">WINDOWS95</A>　　WINDOWS95

自动载入视频

　　与音乐的播放一样，我们可以使用EMBED标签播放视频，

<EMBED SRC="视频文件地址">

属性有：

SRC="FILENAME"	设定文件的路径
AUTOSTART=TRUE/FALSE	是否要文件传送完就自动播放，TRUE是要，FALSE是不要，默认为FALSE
LOOP=TRUE/FALSE	设定播放重复次数，LOOP=6表示重复6次，TRUE表示无限次播放，FALSE播放一次即停止。
STARTIME="分:秒"	设定开始播放时间，如20秒后播放写为STARTIME=00:20
VOLUME=0-100	设定音量的大小。如果没设定的话，就用系统的音量。
WIDTH HEIGHT	设定控制面板的大小

例： *************************************

<body> 播放视频WINDOWS95 　　<EMBED SRC="welcome.avi" autostart=false loop=false width=350 height=250> </body> </html>

[此贴子已经被作者于2005-1-11 18:00:11编辑过]

lfspecter · 发表于 2005-1-10 21:50

多窗口页面(Frames)

使用Frames结构设计的HTML文件，能够将整个窗口分成几个独立的小窗口，每一个窗口可分别载入不同的文件，令人高兴的是，每个窗口是可以相互沟通的。有时用得恰到好处，感觉真是好极了。　　这是一个非常好用的技巧，不过，学习内容也不少，我们一起从基本语法学起吧！

Frames结构的基本格式

　　在有Frames结构的HTML文件中，Frames文件的整体结构为：

　　Framees结构中的每个URL值指定了一个文件（这个文件必须事先做好），这个文件将载入相应的窗口。

[此贴子已经被作者于2005-1-11 18:00:40编辑过]

lfspecter · 发表于 2005-1-10 21:50

各窗口的尺寸设置

我们将窗口分割为几块，横向分用ROWS属性，纵向分用COLS属性，每一块的大小可以由这两个属性的值来实现。

#的值为一对用引号括起来的字符串，字符串中的数字表示每个分窗口所占的尺寸，数字中间用逗号隔开，有几个数字就表示分出了几个窗口。当然，这其中的任何一个数字也可以由“*”来代替，这样表示由浏览器自动设置其大小。　　如：<frameset cols="100,200,*"> 　　　　<frameset cols="100,*,*"> 　　将100像素以外的窗口平均分配　　　　<frameset cols="*,*,*"> 　　　将窗口分为三等份

纵向排列多个窗口： ********************************

横向排列多个窗口： ********************************

纵横排列多个窗口： ********************************

[此贴子已经被作者于2005-1-11 18:01:07编辑过]

lfspecter · 发表于 2005-1-10 21:50

各窗口间相互操作

由Frames分出来的几个窗口的内容并不是静止不变的，往往一个窗口的内容随着另一个窗口的要求而不断变化，这就提高了Frames的利用价值。为了完成各窗口之间的相互操作，我们必须为每一个窗口起一个名字，这个名字用属性Name来定义。

窗口标识(Frame Name) 　　<frame src=url name=“窗口名”>　　例如：　<frame src="frame/a.html" name=“left”> 　　定义了窗口名称，还应该有Target来配合使用，Target属性指定了所链接的文件出现在哪一窗口。Target的值可以是name定义的名称，也可以是以下四类值：

<a href=url target=_blank> 　　显示一个新窗口　　<a href=url target=_self> 　　显示在同一个窗口　　<a href=url target=_parent> 　显示在Frameset的前一份文件的窗口　　<a href=url target=_top> 　　　显示在整个浏览器窗口

例： <frameset cols=50%,50%> 　　<frame src="frame/left.htm"　name="left"> 　　<frame src="frame/right.htm" name="right"> </frameset>

[此贴子已经被作者于2005-1-11 18:02:42编辑过]

lfspecter · 发表于 2005-1-10 21:51

FRAME的其它属性

<frame frameborder=#> #=yes, no	各窗口边框的设置，yes表示有边框，no表示没有边框
<frame marginwidth=# marginheight=#> 　#的值为像素点	设置各窗口的上下左右边界宽度，如果不设置，由浏览器自动决定。
<frame scrolling=#> #=yes, no, auto	滚动条设置，yes 表示有，no表示没有，auto表示由浏览器自动设置，#=缺省值是 auto
<frame noresize>	noresize属性来设置不可变动的框边

各窗口边框的设置举例：

<frameset rows=30%,*>
<frame src="Acol.html" frameborder=1>
<frameset cols=30%,*>
     <frame src="Bcol.html" frameborder=0>
     <frame src="Ccol.html" frameborder=0>
</frameset>
</frameset>


示例(A 有边框，B、C 没有)

页面空白举例：

<frameset cols=50%,50%>
<frame src="A.html">
<frame src="A.html" 
    marginwidth=50 
    marginheight=50>
</frameset>

[此贴子已经被作者于2005-1-11 18:04:40编辑过]

lfspecter · 发表于 2005-1-10 21:51

总复习

前面所讲的内容已经可以满足作网页的要求了，在最后的复习阶段，我们要举一个比较复杂的例子，它基本上涵盖了我们所学的重要内容，我们要通过它来进一步巩固一下已经掌握或者还没有完全掌握的知识。

　　　　其实在我们真正制作网页的过程中，我们常常会借助于“所见即所得”得网页编辑器来完成，例如Netscape Editor、FrontPage98等来完成，不过编辑器有些动作不知怎么总是不到位，这时，打开源文件修描却能使你如鱼得水。另外，格式页的大部分工作恐怕还需要在源文件中进行调整。

学习HTML的方法：

　　根据我自己的学习体验，我总结了几点学习方法供大家参考：

　　1.对于难记的属性不必强行记忆，在用到的时候翻一下语法手册，多用几次就会熟练掌握了。

　　2.刚开始，可以先选择几个不错的网页形式加以模仿，照猫画虎的完成自己的Homepages.

　　3.看到好的网页，可以在浏览器的“编辑”菜单中选择“源文件”，这时我们就可以看到源程序，　　　学习别人制作网页的一些方法和技巧了，有时候通过这种办法可以学到书本上没有的东西，一些新出现的功能也可以率先出现在你的网页中了。

[此贴子已经被作者于2005-1-11 18:19:41编辑过]

zhang007 · 发表于 2005-1-11 11:57

说简单点罢，我想做个简单的帮助文件，该怎么做？

DC.Direct · 发表于 2005-1-12 22:32

真是辛苦了。。。[em17]

		自动登录	找回密码
密码			免费注册