咖啡日语论坛

 找回密码
 注~册
搜索
查看: 2510|回复: 12

一些关于网页制作的(有兴趣的看看)

[复制链接]
发表于 2005-7-27 09:21:08 | 显示全部楼层 |阅读模式
  
网页制作HTML代码全攻略


第一章:HTML 语言的结构
  html文件是标准的ASCII文件,它看起来象是加入了许多被称为标注(tag)的特殊字

符串的普遍文本文件。从结构上讲,html文件由元素(element)组成,组成html文件的元

素有许多种,用于组织文件的内容和指导文件的输出格式。绝大多数元素是“容器”,

即它有起始标记和结尾标记。元素的起始标记叫做起始标注(start tag),元素结束标记

叫做结尾标注(end tag),在起始标注和结尾标注中向的部分是元素体。 每一个元素都

有名称和可选择的属性,元素的名称和属性都在起始标注内标明。 比如体元素(body)
<body backgroud="back-ground.gif">
<h2> demo </h2>
This is my first html file. <p>
</body>

  第一行是体元素的起始标注,它标明体元素从此开始。因为所有的标注都具有相同

的结构,所以我们将仔细分析这个标注的各个部分,以便读者对标注的写法
有一大概了解。

  < 起始标注开始

  body 元素名称,由于元素和标注一一对应,所以元素名也叫标注名。需要注意的是

<和body之间不能有空格。元素名称不分大小写。

  background属性名。一个元素可以有多个属性,属性及其属性值不分大小写。本属

性指明用什么方法来填充背景。

  =指明属性值

  “background.gif”属性值,表示用background.gif文件来填充背景。

  属性名,=,属性值合起来构成一个完整的属性,一个元素可以有多个属性,各个属

性用空格分开。

  > 起始链接链结束。

  第二行和第三行是body元素的元素体,最后一行是body元素的结尾标注。结尾标注

用</开始,随后是元素名,然后是大于号>。

  从上面的例子中,我们可以看出,一个元素的元素体中可以有另外的元素。(上例中

第二行的标题元素<h2>…</h2>和第三行的分段元素<p>。实际上,html文件仅由一个htm

l元素组成, 即文件以<html>开始,以</html>结尾,文件其部分都是

html的元素体。html元素的元素体由
两大部分,即头元素<head>..</head>和体元素<body>…</body>和一些注释组成。头元

素和体元素的元素体又由其它的元素和文本及注释组成。也就是说,一个html文件应具

有下面的结构:

  <html>   html文件开始
   <head> 文件头开始
   文件头
   </head>  文件头结束
   <body> 文件体开始
   文件体
   </body> 文件体结束
  </html>   html文件结束

  需要说明的是,html是一门发展很快的语言,早期的html文件并没有如此严格的结

构,因而现在流行的浏览器(如Netscape,Mosaic等)为保持对早期html文件的兼容性,也

支持不按上述结构编写的html文件。还需要说明的是,各种浏览器对html元素及其属性

的解释也不完全一样,本书中所讲的元素,元素的属性及其输出是以Netscape2.0 浏览

器为准的,作者将尽量给出别的浏览器对某一元素的解释。

  一般来讲,html的元素有下列三种表示方法:

  1)<元素名>文件或超文本</元素名>

  2)<元素名  属性名=“属性值…>文本成超文本</元素名>

  3)<元素名>

  第三种写法仅用于一些特殊的元素,比如分段元素P,它仅仅通知www浏览器在此处分

段,因而不需要界定作用范围, 所以它没有结尾标注。htlm3.0标准中,也定义了</p>

标注,它用于需要界定作用范围的段落,比如增加对齐方式属性的段落。

  注意: HTML并非大小写敏感. <title> 和<TITLE>或者<TiTlE>是一样的.

  html文件中,有些元素只能出现在头元素中,绝大多数元素只能出现在体元素中。

在头元素中的元素表示的是该html文件的一般信息,比如文件名称,是否可检索等等。

这些元素书写的次序是无关紧要的,它只表明该html有还是没有该属性。与此相反,出

现在体元素中的元素是次序敏感的,改变元素在html文件中的次序会改变该html文件的

输出形式。
回复

使用道具 举报

 楼主| 发表于 2005-7-27 09:21:29 | 显示全部楼层
第二章: 构成网页的基本元素
  2.1标题(TITLE)
  Title元素是文件头中唯一一个必须出现的元素,它也只能出现在文件头中。title

元素的格式为:

  <title>文件标题</title>

  title标明该html文件的标题,是对文件内容的概括。一个好的标题应该能使读者从

中判断出该文件的大概内容。文件的标题一般不会显示在文本窗口中,而以窗口的名称

显示出来。除了标识窗口外,当将某一 homepage 存入书签或文件时,title还用作书签

名或缺省的文件名。

  title的长度没有限制,但过长的标题会导致折行,一般情况下它的长度不应超过64

个字符。由于title的作用是标明文件内容,所以太短的title也是不可取的,比如:int

roduction 这个标题,读者不可能根据它判断出本文介绍的是什么。一个好的例子是:

  <title> An Introduction to HTML </title>

  在头元素中还可以出现其他元素,如<isindex>,<meta>等等。这些元素都不是必须

的,而且也不常用。 这些元素的用法和它们的含义可以参考有关文献。

下面是一个最简单的html 文件
<html>
<title>the simplest html file</title>
This is my first html file.
</html>

  §2.2 标题(hn)

  标题元素有6种,分别为h1, h2,…h6,用于表示文章中的各种标题。标题号越小,

字体越大。一般情况下,浏览器对标题作如下解释:

  h1 黑体,特大字体,居中,上下各有两行空行。
  h2 黑体,大字体,上下各有一到两行空行
  h3 黑体(斜体),大字体,左端微缩进,上下空行
  h4 黑体,普通字体,比h3更多缩进,上边一空行
  h5 黑体(斜体),与h4相同缩进,上边一空行
  h6 黑体,与正文有相同缩进,上边一空行

  Netscape 对hn的解释为,一律黑体,字体越来越小。

  hn可以有对齐属性,align=#,#表示

left 标题居左
center 标题居中
right 标题居右

  例: <h2 align=center>Chapter 2 </h2>

<h1>标题元素!</h1> 标题元素!
<h2>标题元素!</h2> 标题元素!
<h3>标题元素!</h3> 标题元素!
<h4>标题元素!</h4> 标题元素!
<h5>标题元素!</h5> 标题元素!
<h6>标题元素!</h6> 标题元素!
  §2.3 分段<P>

  html的浏览器是基于窗口的,用户可以随时改变显示区的大小,所以html将多个空

格以及回车等效为一个空格,这是和绝大多数字处理器不同的。html的分段完全依赖于

分段元素<P>。比如下面两段源文件有相同的输出。

<h2>This is a level Two Heading </h2>
paragraphy one <p>paragraph two <p>
… … … … … … … … … …
<h2>This Is a Level Two Heading</h2>
paragraph one <p>
paragraph Two <p>

  <p>也可以有多种属性,比较常用的属性是:

  aligh=# #可以是left,center,right,其含义同上文。

  例 <p align=center>This is a centered paragraph </p>

  当 html文件中有图形,图形可能占据了窗口的一端,图形的周围可能还有较大的空

白区。这时,不带clear属性的<p>可能会使文章的内容显示在该空白区内。为确保下一

段内容显示在图形的下方,可使用clear属性。clear属性的含义为:

clear=left 下一段显示在左边界处空白的区域
clear=right 下一段显示在右边界处空白的区域
clear=all 下一段的左右两边都不许有别的内容

  §2.4 列表List

  列表用于列举事实,常用的列表有3种格式,即无序列表(unordered List),有序列

表(ordered list)和定义列表(definition list)

  2.4.1 无序列表(ul)

  无序列表用(ul)开始,每一个列表条目用<li>引导,最后是</ul>,注意列表条目不

需要结尾标注</Li>。输出时每一列表条目缩进,并且以黑点标示。

例 :
 <ul>
 <li>Today
 <li>Tommorow
 </ul>
输出为
 ●Today
 ●Tommorow

  2.4.2 有序列表<ol>

  有序列表与无序列表相比,只是在输出时列表条目用数字标示,下面是一个例子及

其输出:

  例:
   <ol>
   <li>Today
   <li>Tommorow
   </ol>
  输出为:
   1.Today
   2.Tommorow

  2.4.3 定义列表<dl>

  定义列表用于对列表条目进行简短说明的场合,用<dl>开始,列表条目用<dt>引导

,它的说明用<dd>引导。

<dl>
<dt>Item 1
<dd>The definition of item 1
<dt>Item 2
<dd>Definition or explaination of item 2
</dl>

输出为:
Item 1
  The definition of item 1
Item 2
  Definiton or explaination of item 2

  2.4.4 改变条目标记

  1.改变无序列表条目标记

  无序列表输出时,每一条目前都有一个黑色圆点,用户可以用type序性修改条目的

标记。type可以是disc 实心圆点 cirde圆圈 square实心方点<ul>

<li type=disc>ONE
<li type=circle>TWO
<li type=square>THREE
</ul>

输出为:
●ONE
○TWO
■THREE

  2.改变有序列表条目标记

  有序列表条目标记的缺省值是阿拉伯数字,可以用type属性修改。方法为:

<li type=#>

#=A, 大写字母
a, 小写字母
I, 大写罗马数字
i, 小写罗马数字
l, 缺省,阿拉伯数字
<ol><li type=A>ONE-ONE
<li>ONE-TWO</ol>
输出为:
A.ONE-ONE
B.ONE-TWO

<ol><li type=a>ONE-ONE
<li>ONE-TWO</ol>
输出为:
a.ONE-ONE
b.ONE-TWO

<ol><li type=I>ONE-ONE
<li>ONE=TWO</ol>
输出为:
Ⅰ.ONE-ONE
Ⅱ.ONE-TWO

<ol><li type=i>ONE-ONE
<li>ONE-TWO</ol>
输出为:
i.ONE-ONE
ii.ONE-TWO

<ol><li type=1>ONE-ONE
<li>ONE-TWO</ol>
输出为:
1.ONE-ONE
2.ONE-TWO

  3.改变有序列表条目的起始数字

  有序列表的条目数字在缺省情况下是从1开始的,用start属性可修改这一值。方法

为<ol start=#> #是条目起始号

<ol start=5>
<li type=A>ONE-ONE
<li>ONE-TWO
<ol start=10>
<li>TWO-ONE
<li type=i>TWO-ONE
</ol></ol>

输出为:
E.ONE-ONE
F.ONE-TWO
10.TWO-ONE
xi.TWO-TWO

  2.4.5 列表的嵌套

  各种列表可以相互嵌套,每一个列表条目都可以是一个单独的列表。每嵌套一层,

列表条目的输出就会有更大的缩进。请参照上面的例子。

   §2.5 预格式化文本<pre>

  html的输出是基于窗口的,因而html文件在输出时都是要重新格式化的,若确实不

需要重新格式化的内容,可以用<pre>…</pre>通知浏览器。浏览器在输出时,对这部

分内容几乎不做修改地输出,输出的字体电传打字机字体。早期的html规范规定在预格

式化区内不能出现格式化输出的元素。如hn等,Netscape在遇到预格式化元素时,允许

其中有其他元素。

<pre>
please use your card.
VISA Master
<b>Here is an order form.</b>
<ul><li>Fax
<li>Air Mail </ul>
</pre>

输出为:
please use your card
VISA Master
Here is an order form.
●Fax
●Air Mail

  §2.6 块引用<BLOCKQUOTE>

  块引用用<BLOCKQUOTE>标注,使屏幕显示单独的一块。大多数的浏览器采用缩进编

排的方式,使这一块和其他部分的文本区分开来,上下各有一空行。

块引用(Blockquote) <blockquote>...</blockquote>
Her Song:
<blockquote>
When I was young, I listened to the radio
waiting for my favorite songs....
</blockquote>
Her Song:

When I was young, I listened to the radio waiting for my favorite songs....

  §2.7 居中

  很多元素都有对齐方式属性,如hn

、p等。也可以直接用居中标注<center>…</center>

<h3 align=center>Wonderful!!</h3>

<center>This must be my dream.</center>

输出为:

Wonderful!!
This must be my dream.
回复 支持 反对

使用道具 举报

 楼主| 发表于 2005-7-27 09:22:39 | 显示全部楼层
第三章:超文本链接指针
  超文本链接指针是html最吸引人们优点之一。链接指针可以使读者在整个Internet

网上方便地链接。使用超文本链接指针可以使顺序存放的文件具有一定程度上随机访问

的能力,而每一个链接指针正好代表了作者或者读者的思维跳跃,这更加符合人类的思

维方式。因而组织得好的链接指针有助于理解作者的意图。
  一个超文本链接指针由两部分组成。一是被指向的目标,它可以是同一文件的另一

部分,也可以是世界另一端的一个文件,还可以是动画或音乐;另一部分是指向目标的

链接指针。

  §3.1 统一资源定位器URL

  统一资源定位器(uuiform Resource Locator)是文件名的扩展。在单机系统中,定

位一个文件需要路径和文件名,对于遍布全球的Internet网,显然还需要知道文件存放

在哪个网络的哪台主机中才行。与单机系统不一样的是在单机系统中,所有的文件都由

统一的操作系统管理,因而不必给出访问该文件的方法;而在Internet上,各个网络,

各台主机的操作系统都不一样,因此必须指定访问该文件的方法。一个URL包括了以上所

有的信息。它的构成为:

  protocol:// machine.name[:port]/directory/filename

  其中protocol是访问该资源所采用的协议,即访问该资源的方法,它可以是: htt

p 超文本传输协议,该资源是html文件file 文件传输协议,用ftp访问该资源ftp 文件传

输协议,用ftp访问该资源gopher gopher协议,该资源是gopher文件news 表明该资源是网

络新闻

  madcine.name 是存放该资源主机的IP 地址,通常以字符形式出现,如

sun.ihep.ac.cn port端口号,是服务器在该主机所使用的端口号。一般情况下端口号不

需要指定。 只有当服务器所使用的端口号不是缺省的端口号时才指定。

  directory和filename是该资源的路径和文件名。

  一个典型的URL为:http://www.ihep.ac.cn 它表示中科院高能所WWW服务器上的起始

html文件。(文件具体存放的路径及文件名取决于该WWW服务器的配置情况)。

  与单机系统绝对路径,相对路径的概念类似,统一资源定位器也有绝对URL和相对UR

L之分。上文所述的是绝对URL。相对URL是相对于你最近访问的URL。比如你正在观看一

个URL为http://www.inep.ac.cn/index.html的文件,如果想看同一个目录下的另一个文

件china.html,你可以直接使用china.html,这时china.html就是一个相对url,它的绝

对url为http://www.ihep.ac.cn/china.html

  §3.2 指向一个目标<a>

  在html文件中用链接指针指向一个目标。其基本格式为:

  <a href="url">字符串

  href属性中的统一资源定位器(url)是被指向的目标,随后的“字符串”在html文件

中充当指针的角色, 它一般显示为蓝色。当读者用鼠标点这个字符串时,浏览器就会将

url处的资源显示在屏幕上。例如:

  IHEP CHINA homepage

  用户用鼠标点取IHEP china homepage,即可看到高能所编写的关于中国情况的介绍

。在这个例子中, 充当指针的是IHEP china homepage,下面我们将看到用图象做为指

针的例子。

  在编写html文件时,需要知道目标的url。如何才能得到目标的url呢?对于自己主

机内的文件,它的url 可以根据该文件的实际情况决定。对于Interner上的资源, 我们

在用浏览器观看时,它的url会在浏览器的Location一栏中显示出来,把它抄下来写到你

的html文件中即可。

  在编写html文件时,对有能确定关系的一组资源(比如在同一个目录中)应采用相对u

rl, 这不仅简化你的html文件,而且便于维护。比如当你需要将某个目录整个搬到另外

一个地方或把某一主机的资源移到另一台主机时,用相对url写的html文件用不看更新其

中的url(只要它们的相对关系没有改变)。但如果你用绝对url编写html,你就不得不逐

字修改每个链接指针中的url,这是一件很乏味也很容易出错的工作。对于各个资源之间

没有固定的关系,比如你的html文件是介绍各大学情况的,它所指向的目标分布在全球

的主机中,这时你就只能用绝对url了。

  在本章的末尾,作者给出一个完整的html文件,该文件使用了前三章介绍的全部元

素,以便于读者理解。

  §3.3 标记一个书签

  上节提到的链接指针可以使读者在整个Interner网上方便地链接。但如果你编写了

一个很长的html文件,从头到尾地读很浪费时间,能不能在同一文件的不同部分之间也

建立起链接,使用户方便地在上下方之间跳转呢?答案是肯定的。前面曾提到过一个超

文本链接指针包括两个部分,一个指向目标的链接指针,另一个是被指向的目标。对于

一个完整的文件,我们可以用它的url来唯一地标识它, 但对于同一文件的不同部分,

我们怎样来标识呢?下面的内容将介绍链接指针元素的另外的一个用途,标识书签。

  标识一个书签的方法为:

  <a name="name">text</a>

name属性将放置该标记的地方标记为“name”,name是一个全文唯一的标记串,text部

分可有可无。这样,我们就把放置标记的地方做了一个叫做“name”的标记。

  做好标记后,可以用下列方法来指向它,

  <a href="url#name">text

url是放置标记的html文件的url name是标记名,对于同一个文件,可以写为

  <a href="#name">text

这时就可以点取text跳转到标记名为name的部分了。

  §3.4 目标窗口

  如果希望被指向的目标在一个新的窗口中显示,可以使用target属性来修饰链接指

针元素。

  <a href="url" target="window-name">text

将url代表的资源显示在一个新的窗口中,该窗口的名字叫window-name。

  §3.5 图象链接指针

  图象也可以做为链接指针。格式为:
  <a href="url"><img src="url">

  可以看出,上例中用<img src="url">取代了链接指针中text的位置。

  <img src="url">是图象元素,它表明显示url代表的图象文件,参见图象一章。

  下面是一个简单的图象链接指针:
  <a href="www.ihep.ac.cn">China home page<img src="flag.gif">

  边框 <img border=#> #=value
<a href="URL">
<img src=URL border=15>



  §3.6 图象地图(image map)

  上一节介绍的图象链接指针每幅图只能指向一个地点,而图象地图可以把图象分成

多个区域,每个区域指向不同的地点。你可以用图象地图编出很漂亮的html文件。

  使用图象地图稍微复杂一点。图象地图不仅需要在html文件中说明,它还需要一个

后缀为.map的文件,用来说明图象分区及其指向的url的信息。 在.map文件中说明分区

信息的格式如下:

  rect url 左上角坐标,右下角坐标
  poly url 各顶点坐标
  circle url 直径两端点坐标
  default url

  rect指定一个矩形区域,该区域的位置由左上角坐标和右下角坐标说明。poly 指定

一多边形区域, 该区域的位置由各顶点坐标说明。circle 指定一圆形区域, 该区
域的位置由垂直通过圆心的直径与该圆的交点坐标说明。default 指定图象地图其它部

分的url。坐标的写法为:x,y ,各点坐标之间用空格分开。下面是一个完整的说明文件



  default http://www.ihep.ac.cn
  rect http://www.ibm.com 140,20 280,60
  poly http://www.microsoft.com 180,80 200,140
  circle http://www.yahoo.com 80,140 80,100

  图象地图需要一个特殊的处理程序 imagemap,imagemap放在/cgi-bin 中。在html

文件中引用图象地图的 格式为:

  <a href="/cgi-bin/imagemap/mymap.map">

  <img src="mymap.gif" ismap>

  可以看出这是一个包含图象元素的链接指针元素。图象元素指明用于图象地图的图

象的url,并用Ismap属性说明。需要说明的是链接指针中的href属性,它由两部分组成

,第一部分是/cgi-bin/imagemap ,它指出用哪个程序来处理图象地图,它必须原样写

入,第二部分才是图形地图的说明文件mymap.map。/cgi-bin/imagemap/mymap.map绝不

表示mymap.map在/cgi-bin/imagemap目录中。在netscape扩展中,图象地图可以用一种

比较简化的方式来表示,这就是客户端图象地图。用户端地图可以将图象地图的说明文

件写在html文件中,而且不需要另外的程序来处理。这就使html作者可以用同别的元素

相一致的写法来写图象地图。 客户端图象地图还有一个优点,当鼠标指向图象地图的不

同区域时,浏览器能显示出各个区域所指向的url。但目前只有netscape2.0以上版本才

支持这一扩展。

  用户端图象地图的格式为:

  <img src="url" usemap="#mymap">

  src="url" 指定用作图象地图的图象

  usemap属性指明这是客户端图象地图

  "#mymap"是图象文件说明部分的标记名,浏览器寻找名字为mymap的<map>元素并从

中得到图象地图的分区信息。客户端图象地图的分区信息用<map name=mapname>元素说

明,name属性命名<map>元素。图象地图的各个区域用<area shape="形状" coords="坐

标" href="url">说明,形状可以是:rect矩形,用左上角,右下角的坐标表示,各个坐

标值之间用逗号分开; poly多边形,用各顶点的坐标值表示;circle圆形,用圆心及半

径表示,前两个参数分别为圆心的横、纵坐标, 第三个参数为半径。
href="url",表示该区域所指向的 资源的url,也可以是nohref,表示在该区域鼠标点

取无效。客户端图象地图各个区域可以重叠,重叠区以先说明的条目为准,下面是一个

例子:

源程序:
<img src="mapimg.gif" usemap="#Face>
<map name="Face">
<!Text BOTTON> 此行是注释
<area shape="rect"
href="page.html"
coords="140,20,280,60">
<!Triangle BOTTON>
<area shape="poly"
href="image.html"
coords="100,100,180,80,200,140">
<!FACE>
<area shape="circle"
href="nes.html"
coords="80,100,60>
</map>
回复 支持 反对

使用道具 举报

 楼主| 发表于 2005-7-27 09:26:30 | 显示全部楼层
第四章: 版面风格控制   

§4.1 字体大小  html有七种字号,1号最小,7号最大。缺省字号为3,可以用<basefontsize=字号>设置缺省字号。
  
设置文本的字号有两种办法,一种是设置绝对字号,;另一种是设置文本的相对字号;。用第二种方法时“+”号表示字体变大,“-”号表示字体变小。
  
§4.1.2 字体风格   字体风格分为物理风格和逻辑风格。
 
物理风格直接指定字体,物理风格的字体有:<b>黑体,<i>斜体,<u>下划线,<tt>打字机体。
  
逻辑风格指定文本的作用:<em>强调 <srrony>特别强调 <code>

源代码<samp>例子 <kbd>键盘输入 <var>变量 <dfn>定义 <cite>引用

<small>较小<big>较大 <sup>上标 <sup>下标 物理风格(Physical Style): <b>今天天

气真好!</b> 今天天气真好! <i>今天天气真好!</i> 今天天气真好! <u>今天天气

真好!</u> 今天天气真好! <tt>今天天气真好!</tt> 今天天气真好! <sup>今天天

气真好!</sup> 今天天气真好! <sub>今天天气真好!</sub> 今天天气真好! <s>今

天天气真好!</s> 今天天气真好! <strike>今天天气真好!</strike> 今天天气真好

! 逻辑风格(Logical Style): <em>今天天气真好!</em> 今天天气真好! <strong>今

天天气真好!</strong> 今天天气真好! <code>今天天气真好!</code> 今天天气真好

! <samp>今天天气真好!</samp> 今天天气真好! <kbd>今天天气真好!</kbd> 今天

天气真好! <var>今天天气真好!</var> 今天天气真好! <dfn>今天天气真好!</dfn>

今天天气真好! <cite>今天天气真好!</cite> 今天天气真好! <small>今天天气真好

!</small> 今天天气真好! <big>今天天气真好!</big> 今天天气真好!

  §4.1.3 字体颜色   字体的颜色用...指定   xxxxxx可以是6位16进数,分别

指定红、绿、兰的值,也可以是black,olive,teal,red,blue,maroon,navy,gray

,lime,fudrsia,white,green,purple,sliver,yellow,aqua 之一。   字体风

格   字体风格   
§4.1.4 闪烁   <blink>文本</blink>使文本闪烁,闪烁频率为1秒钟一次。  
 §4.2 标尺线(hr)   标尺线,一般用于分隔同一文体的不同部分。在窗口中划一条标尺线非常简单,只要写一个<hr>即可。标尺线的宽度用<hrsize=n>指定,width=#>指n是线宽,单位是象素。例:<hr size=10>。 <hr 定标尺线长度,可以指定绝对线长,也可以指定标尺线长度占窗口宽度的百分比。例<hr width=50> 、<hr width=50%>。   标尺线的位置用<hr align=#>指定。   
#是left成right之一,left表示左端与左边界对齐,right是右端与右边界对齐,缺省,标尺线出现在窗口正中。
16 进制 RGB 数码,或者是下列预定义色彩: Black,

Olive, Teal, Red, Blue, Maroon, Navy, Gray, Lime, Fuchsia, White, Green,

Purple, Silver, Yellow, Aqua   
4.3 行间图象   行向图象使你的页面更加漂亮

,但是行向图象会导致网络通讯量急剧增大。使访问时间延长。所以在主页(homepage)

,不宜采用很大的图象。如果确实需要一些大图象,最好在主页中用一个缩小的图象指

向原图,并标明该图的大小。这样读者可以快速地访问您的主页,自己选择看还是不看

那些图象。   图象的基本格式为:    <img src="image-url">或<img

src="image-urd" alt="text">image-url是图象文件的url。目前,大部分浏览器支持

.gif 和 .xbm文件,netscape还支持jpeg文件。alt属性告诉不支持图象的浏览器用text

代替该图。  
 4.3.2 图象与文本的对齐方式   图象在窗口中会占据一块空间,在

图象的左右可能会有空白,不加说明时,浏览器将随后的文本显示在这些空白中,显示

的位置由align属性指定。 <img src=URL align=top> My face! My Face! <img

src=URL align=middle> My face! My Face! <img src=URL align=bottom> My face!

My Face!

4.3.3 图象在页面中的对齐方式/布局(Floating Image) <img align=left>

<img src=URL align=left>My Face!<br> It is always<br> smiling.<br>

Hahaha....<br> My Face! It is always smiling. Hahaha....     <img

align=right> My Face! It is always smiling. Hahaha....     <br clear=all>

<img src=URL align=left>My Face!<br> It is always <br clear=all> smiling.<br>

Hahaha....<br> My Face! It is always smiling. Hahaha....     <img vspace=#

hspace=#> #=value <img src=URL align=left vspace=10 hspace=20>My Face!<br> It

is always<br> smiling.<br> Hahaha....<br> My Face! It is always smiling.

Hahaha....   

4.4 分行<BR>和禁止分行<nobr>

  <Br>表示在此处分行,<nobr>....</nobr>叫通知浏览器,其中的内容在一行内显示

,若一行内显示不了,则超出部分被裁剪掉。   <br clear=#>clear属性标明下一行

的情况,如clear=left,表示下一行从左边界处开始。#可以是left,right,all之一。

例:   

§4.5 背影和文本颜色   窗口背景可以用下列方法指定  <body

background="image-url">   <body bgcolor=# text=# link=# alink=# vlink=#>  

 前者指定填充背景的图象,如果图象的大小小于窗口大小,则把背景图象重复,直到

填满窗口区域。   后者指定的是16进制的红、绿、兰分量。 bgcolor 背景颜色 Text

文本颜色 Link 链接指针颜色 alinik 活动的链接指针颜色 vlinik 已访问过的链接指

针颜色   例 <body bgcolor=FFoooo>大红背景色.   注意,此时体元素必须写完整

,即用<body>结束   

4.6 转义字符与特殊字符   html中< , >,&有特殊含义,(

前两个字符用于标注,&用于转义),不能直接使用。使用这三个字符时,应使用它们的

转义序列。   & 的转义序列为 & amps 或 & #38;  < 的转义序列为 & Lt; & #60

;  > 的转义序列为 & gt; & #62;   前者为字符转义序列,后者为数字转义序列

。   例如 & Lt; font &Lgt;显示为<font>若直接写为<font>则被认为是一个标注。

  需要说明的是: a. 转义序列各字符间不能有空格; b. 转义序列必须以“;”结

束; c. 单独的&不被认为是转义开始。   如“ & Lt; ”被解释为 “& Lt;”而不

是<“&# 62 ;”被解释为 “& # 60;”而不是>另一个需要转义的字符是引号,它的转

义序列为"""或""",例如<img src="image.gif"alt="A &quol; real "

example">。html使用的字符集是ISO &859 Larin-1字符集,该字符集中有许多标准键盘

上无法输入的字符。对这些特殊字符只能使用转义序列。
回复 支持 反对

使用道具 举报

 楼主| 发表于 2005-7-27 09:26:58 | 显示全部楼层
第五章:表格(Table)
  §5.1 表格的基本形式
  一个表由<table>开始,</table>结束,表的内容由<tr>,<th>和<td>定义。<tr>说

明表的一个行,表有多少行就有多少个<tr>;<th>说明表的列数和相应栏目的名称,有

多少个栏就有多少个<th>;<td>则填充由<tr>和<th>组成的表格。是否用表格线分开为

部分内容用border属性说明,下面是一个有表格线和一个元表格线的表及其输出。

带边框的表格:
<table border>
<tr><th>Food</th><th>Drink</th><th>Sweet</th>
<tr><td>A</td><td>B</td><td>C</td>
</table>

Food Drink Sweet
A B C

不带边框的表格:
<table>
<tr><th>Food</th><th>Drink</th><th>Sweet</th>
<tr><td>A</td><td>B</td><td>C</td>
</table>

Food Drink Sweet
A B C

  5.2 有通栏的表

  1、有横向通栏的表用<th colspan=#>属性说明:colspan表示横向栏距,#代表通栏

占据的网格数,它是一个小于表的横向网格数的整数。

跨多列的表元 <th colspan=#>
<table border>
<tr><th colspan=3> Morning Menu</th>
<tr><th>Food</th> <th>Drink</th> <th>Sweet</th>
<tr><td>A</td><td>B</td><td>C</td>
</table>
Morning Menu
Food Drink Sweet
A B C

  2、有纵向通栏的表用rowspan=#属性说明:rowspan表示纵向栏距,#表示通栏占据

的网格数,应小于纵向网络数。需要说明的是有纵向通栏的表,每一行必须用</tr>明确

给出一横向栏目结束,这是和表的基本形式不同的。

跨多行的表元
<th rowspan=#>
<table border>
<tr><th rowspan=3> Morning Menu</th>
<th>Food</th> <td>A</td></tr>
<tr><th>Drink</th> <td>B</td></tr>
<tr><th>Sweet</th> <td>C</td></tr>
</table>
Morning Menu Food A
Drink B
Sweet C

  5.3 表格属性

  1、表的大小用width=#和height=#属性说明。前者为表宽,后者为表高,#是以象素

为单位的整数。

<table border width=# height=#>
表格尺寸设置:
<table border width=170 height=100>
<tr><th>Food</th><th>Drink</th><th>Sweet</th>
<tr><td>A</td><td>B</td><td>C</td>
</table>

Food Drink Sweet
A B C

  2、边框宽度由border=#说明,#为宽度值,单位是象素。

<table border=#>
边框尺寸设置:
<table border=10>
<tr><th>Food</th><th>Drink</th><th>Sweet</th>
<tr><td>A</td><td>B</td><td>C</td>
</table>

Food Drink Sweet
A B C

  3、表格间距即划分表格的线的粗细用cellspacing=#表示,#的单位是象素,下面的

例子将表格间距定义为10个象素,它看起来象用很粗的线划分的表格。

<table border cellspacing=#>
表元间隙设置:
<table border cellspacing=10>
<tr><th>Food</th><th>Drink</th><th>Sweet</th>
<tr><td>A</td><td>B</td><td>C</td>
</table>

Food Drink Sweet
A B C

  5.4 表中文本的输出

  1、文本与表框的距离用cellpadding=#说明。下面的例子使表的内容与表框离开10

个象素。

<table border cellpadding=#>
表元内部空白设置:
<table border cellpadding=10>
<tr><th>Food</th><th>Drink</th><th>Sweet</th>
<tr><td>A</td><td>B</td><td>C</td>
</table>

Food Drink Sweet
A B C

  2、表格的后度大于其中的文本后度时,文本在其中的输出位置用align=#说明。#是

left,center和right三者之一,分别表示左对齐,居中和右对齐,align属性可修饰<tr

>,<th>和<td>标注。

<tr align=#>
<th align=#> #=left, center, right
<td align=#>
<table border width=160>
<tr>
<th>Food</th><th>Drink</th><th>Sweet</th>
<tr>
<td align=left>A</td>
<td align=center>B</td>
<td align=right>C</td>
</table>
Food Drink Sweet
A B C

  3、表格的高度大于其中文本的高度时,可以用valign=#说明文本在其中的位置。#

是top,middle,bottom,baseline四者之一。分别表示上对齐,文本中线与表格中线对齐

, 下对齐,文本基线与表格中线对齐,特别注意的是baseine对齐方式,它使得文本出

现在网格的上方而不是相象中的下半部。同样,valign可以修饰<tr>,<th>,<td>中的任

何一个。

<tr valign=#>
<th valign=#> #=top, middle, bottom, baseline
<td valign=#>
<table border height=100>
<tr>
<th>Food</th><th>Drink</th>
<th>Sweet</th><th>Other</th>
<tr>
<td valign=top>A</td>
<td valign=middle>B</td>
<td valign=bottom>C</td>
<td valign=baseline>D</td>
</table>
Food Drink Sweet Other
A B C D

  5.5 浮动表格

  所谓浮动表格是指表与文件中重中内容对齐时,若在现在位置上不能满足其对齐方

式,表格含上下移动,即“挤开”一些内容,直到满足其对齐要求。

  浮动属性一般由align=left或right指定。

  下面的例子也可以看出,cllign=left时把字符串“挤到”了表的右边。当右边空间

不够时,该字符串会显示在表的下在边,看起来象是表“浮”到了字符串上。

<table align=left>
<table align="left" border>
<tr><th>Food</th><th>Drink</th><th>Sweet</th>
<tr><td>A</td><td>B</td><td>C</td>
</table>
My favorites...<br>
cookies, chocolates, and more.
Food Drink Sweet
A B C
My favorites...
cookies, chocolates, and more.


<table align=right>
Food Drink Sweet
A B C
  5.6 表格颜色

  表格的颜色用bgcolor=#指定。

  #是16进制的6位数,格式为rrggbb,分别表示红、绿、兰三色的分量。或者是16种

已定义好的颜色名称,参见文本颜色。

<table border>
<tr><th bgcolor=000000>
Food</th>
<th bgcolor=whit>Drink</th>
<tr><td bgclor=ffaaaa>A</td><td>B</td>
</table>

Food Drink
A B
回复 支持 反对

使用道具 举报

 楼主| 发表于 2005-7-27 09:28:31 | 显示全部楼层
第六章:帧结构 Frame
  6 .1 帧结构的基本格式
  帧结构将流览器的窗口分成多个区域,每个区域可以单独显示一个html文件,各个

区域也可相关连地显示某一个内容,比如可以将索引放在一个区域,文件内容显示在另

一个区域。

帧结构的基本结构如下
<html>
<head>
<title>...</title>
</head>
<noframes>...</noframes>
  <frameset>
  <frame src="url">
</frameset>
</html>

  <noframes>...</noframes>中的内容显示在不支持帧结构的浏览器窗口中,因而这里

指向一个普通版本的html文件,以便使用不支持帧结构浏览器的用户阅读。

  帧结构由<frameset>指定,并且可以嵌签,分区中种部分显示的内容用<framre>指

定。

  可以将窗口横向分成几个部分,也可以分成纵向几个部分,还可以混和帧结构。

  6.2 横向帧结构

  横向帧结构用<frameser rows=#>指定,#可以是一个百分数,也可以是一整数。前

者规定各帧占窗口的百分数,后者指定各帧的绝对大小。例如,下面的例子将窗口分成3

0%、20%、50%的几个区域,各区域的内容分别为A.html,B.html,C.html.

<frameset rows=#>

横向排列多个窗口:

<frameset rows=25%,25%,50%>
<frame src="A.html">
<frame src="B.html">
<frame src="C.html">
</frameset>

A
B
C

  6.3 纵向帧结构

  纵向帧结构用<frameset cols=#>指定,参见下例:

<frameset cols=#>

纵向排列多个窗口:

<frameset cols=30%,20%,50%>
<frame src="A.html">
<frame src="B.html">
<frame src="C.html">
</frameset>

A B C

  6.4 混合帧结构

  将窗口分成横纵几个区域时,用<frameset>代替<frame>链接至即可将原的分好的<f

rame>区域再次帧结构, 下面的例子先将窗口分成20%,80%, 然后将右边的区域再分成

分别占40%和60%的上下两个区域。

纵横排列多个窗口:

<frameset cols=20%,*>
<frame src="A.html">
<frameset rows=40%,*>
<frame src="B.html">
<frame src="C.html">
</frameset>
</frameset>

A B
C

  6.5 帧结构与帧中文本的间距

  帧结构与其中的文本间距可以用Marginwidth=#和marginneigh=#来指定,前者指定

文本与帧结构的边缘的横向距离,后者为纵向距离,其单位都为象素,下面的例子中,

将右边帧结构的左右边距,上下空白都设为50个象素。

  6.6 帧结构间的关联

  帧结构之间可以有特定的关联,比如将某一帧的内容输出到另一个帧,这样我们就

可以把其中一个帧作为输出帧,另一个帧作为选择帧。实现这种关联需要做下列的事情



  ①在帧结构的hrme文件中标记各个帧,标记的方法是在<frame>中加入name属性,比

如上例,定义左边的帧为输出,右边帧为主帧。

  <frame src="A.html"name=display>
  <frame src="B.htme"name=index>

  ②在B.html文件中指定输出到哪个帧方法是在B.html文件中加入下列一行。

  <base target="display">

  这便得用鼠标点取B.html中的链接指针,它的输出会显示在左边的帧中。

  特殊的 4 类操作(很有用喔)

<a href=url target=_blank> 新窗口
<a href=url target=_self> 本窗口
<a href=url target=_parent> 父窗口
<a href=url target=_top> 整个浏览器窗口
回复 支持 反对

使用道具 举报

 楼主| 发表于 2005-7-27 09:29:16 | 显示全部楼层
1. oncontextmenu="window.event.returnvalue=false" 将彻底屏蔽鼠标右键
<table border oncontextmenu=return(false)><td>no</table> 可用于Table
2. <body onselectstart="return false"> 取消选取、防止复制
3. onpaste="return false" 不准粘贴

4. oncopy="return false;" oncut="return false;" 防止复制

5. <link rel="Shortcut Icon" href="favicon.ico"> IE地址栏前换成自己的图标

6. <link rel="Bookmark" href="favicon.ico"> 可以在收藏夹中显示出你的图标

7. <input style="ime-mode:disabled"> 关闭输入法

8. 永远都会带着框架
<script language="javascript"><!--
if (window == top)top.location.href = "frames.htm"; //frames.htm为框架网页
// --></script>

9. 防止被人frame
<SCRIPT LANGUAGE=javascript><!--
if (top.location != self.location)top.location=self.location;
// --></SCRIPT>

10. <noscript><iframe src=*.html></iframe></noscript> 网页将不能被另存为

11. <input type=button value=查看网页源代码
onclick="window.location = 'view-source:'+ 'http://www.csdn.net/'">

12. 怎样通过asp的手段来检查来访者是否用了代理
<% if Request.ServerVariables("HTTP_X_FORWARDED_FOR")<>"" then
response.write "您通过了代理服务器,"& _
"真实的IP为"&Request.ServerVariables("HTTP_X_FORWARDED_FOR")
end if
%>

13. 取得控件的绝对位置

//javascript
<script language="javascript">
function getIE(e){
var t=e.offsetTop;
var l=e.offsetLeft;
while(e=e.offsetParent){
t+=e.offsetTop;
l+=e.offsetLeft;
}
alert("top="+t+"nleft="+l);
}
</script>

//VBScript
<script language="VBScript"><!--
function getIE()
dim t,l,a,b
set a=document.all.img1
t=document.all.img1.offsetTop
l=document.all.img1.offsetLeft
while a.tagName<>"BODY"
set a = a.offsetParent
t=t+a.offsetTop
l=l+a.offsetLeft
wend
msgbox "top="&t&chr(13)&"left="&l,64,"得到控件的位置"
end function
--></script>

14. 光标是停在文本框文字的最后
<script language="javascript">
function cc()
{
var e = event.srcElement;
var r =e.createTextRange();
r.moveStart('character',e.value.length);
r.collapse(true);
r.select();
}
</script>
<input type=text name=text1 value="123" onfocus="cc()">

15. 判断上一页的来源
asp:
request.servervariables("HTTP_REFERER")

javascript:
document.referrer

16. 最小化、最大化、关闭窗口
<object id=hh1 classid="clsid:ADB880A6-D8FF-11CF-9377-00AA003B7A11">
<param name="Command" value="Minimize"></object>
<object id=hh2 classid="clsid:ADB880A6-D8FF-11CF-9377-00AA003B7A11">
<param name="Command" value="Maximize"></object>
<OBJECT id=hh3 classid="clsid:adb880a6-d8ff-11cf-9377-00aa003b7a11">
<PARAM NAME="Command" value="Close"></OBJECT>

<input type=button value=最小化 onclick=hh1.Click()>
<input type=button value=最大化 onclick=hh2.Click()>
<input type=button value=关闭 onclick=hh3.Click()>
本例适用于IE

17.
<%
'定义数据库连接的一些常量
Const adOpenForwardOnly = 0

'游标只向前浏览记录,不支持分页、Recordset、BookMark
Const adOpenKeyset = 1 '键集游标,其他用户对记录说做的修改将反映到记录集中,

但其他用户增加或删除记录不会反映到记录集中。支持分页、Recordset、BookMark
Const adOpenDynamic = 2 '动态游标功能最强,但耗资源也最多。用户对记录说做的修

改,增加或删除记录都将反映到记录集中。支持全功能浏览(ACCESS不支持)。
Const adOpenStatic = 3 '静态游标,只是数据的一个快照,用户对记录说做的修改,

增加或删除记录都不会反映到记录集中。支持向前或向后移动

Const adLockReadOnly = 1 '锁定类型,默认的,只读,不能作任何修改
Const adLockPessimistic = 2 '当编辑时立即锁定记录,最安全的方式
Const adLockOptimistic = 3 '只有在调用Update方法时才锁定记录集,而在此前的其

他操作仍可对当前记录进行更改、插入和删除等
Const adLockBatchOptimistic = 4 '当编辑时记录不会被锁定,而更改、插入和删除是

在批处理方式下完成的

Const adCmdText = &H0001
Const adCmdTable = &H0002
%>

18. 网页不会被缓存
HTM网页
<META HTTP-EQUIV="pragma" CONTENT="no-cache">
<META HTTP-EQUIV="Cache-Control" CONTENT="no-cache, must-revalidate">
<META HTTP-EQUIV="expires" CONTENT="Wed, 26 Feb 1997 08:21:57 GMT">
或者<META HTTP-EQUIV="expires" CONTENT="0">
ASP网页
Response.Expires = -1
Response.ExpiresAbsolute = Now() - 1
Response.cachecontrol = "no-cache"
PHP网页
header("Expires: Mon, 26 Jul 1997 05:00:00 GMT");
header("Cache-Control: no-cache, must-revalidate");
header("Pragma: no-cache");

19. 检查一段字符串是否全由数字组成
<script language="javascript"><!--
function checkNum(str){return str.match(/D/)==null}
alert(checkNum("1232142141"))
alert(checkNum("123214214a1"))
// --></script>

20. 获得一个窗口的大小
document.body.clientWidth,document.body.clientHeight

21. 怎么判断是否是字符
if (/[^x00-xff]/g.test(s)) alert("含有汉字");
else alert("全是字符");

22.TEXTAREA自适应文字行数的多少
<textarea rows=1 name=s1 cols=27

onpropertychange="this.style.posHeight=this.scrollHeight">
</textarea>

23. 日期减去天数等于第二个日期
<script language=javascript>
function cc(dd,dadd)
{
//可以加上错误处理
var a = new Date(dd)
a = a.valueOf()
a = a - dadd * 24 * 60 * 60 * 1000
a = new Date(a)
alert(a.getFullYear() + "年" + (a.getMonth() + 1) + "月" + a.getDate() +

"日")
}
cc("12/23/2002",2)
</script>

24. 选择了哪一个Radio
<HTML><script language="vbscript">
function checkme()
for each ob in radio1
if ob.checked then window.alert ob.value
next
end function
</script><BODY>
<INPUT name="radio1" type="radio" value="style" checked>Style
<INPUT name="radio1" type="radio" value="barcode">Barcode
<INPUT type="button" value="check" onclick="checkme()">
</BODY></HTML>

25.获得本页url的request.servervariables("")集合
Response.Write "<TABLE border=1><!-- Table Header

--><TR><TD><B>Variables</B></TD><TD><B>value</B></TD></TR>"
for each ob in Request.ServerVariables
Response.Write

"<TR><TD>"&ob&"</TD><TD>"&Request.ServerVariables(ob)&"</TD></TR>"
next
Response.Write "</TABLE>"

26.
本机ip<%=request.servervariables("remote_addr")%>
服务器名<%=Request.ServerVariables("SERVER_NAME")%>
服务器IP<%=Request.ServerVariables("LOCAL_ADDR")%>
服务器端口<%=Request.ServerVariables("SERVER_PORT")%>
服务器时间<%=now%>
IIS版本<%=Request.ServerVariables"SERVER_SOFTWARE")%>
脚本超时时间<%=Server.ScriptTimeout%>
本文件路径<%=server.mappath(Request.ServerVariables("SCRIPT_NAME"))%>
服务器CPU数量<%=Request.ServerVariables("NUMBER_OF_PROCESSORS")%>
服务器解译引擎<%=ScriptEngine & "/"& ScriptEngineMajorVersion

&"."&ScriptEngineMinorVersion&"."& ScriptEngineBuildVersion %>
服务器操作系统<%=Request.ServerVariables("OS")%>

27.ENTER键可以让光标移到下一个输入框
<input onkeydown="if(event.keyCode==13)event.keyCode=9">

28. 检测某个网站的链接速度:
把如下代码加入<body>区域中:
<script language=javascript>
tim=1
setInterval("tim++",100)
b=1

var autourl=new Array()
autourl[1]="www.njcatv.net"
autourl[2]="javacool.3322.net"
autourl[3]="www.sina.com.cn"
autourl[4]="www.nuaa.edu.cn"
autourl[5]="www.cctv.com"

function butt(){
document.write("<form name=autof>")
for(var i=1;i<autourl.length;i++)
document.write("<input type=text name=txt"+i+" size=10 value=测试中……>

=》<input type=text name=url"+i+" size=40> =》<input type=button value=GO

onclick=window.open(this.form.url"+i+".value)><br/>")
document.write("<input type=submit value=刷新></form>")
}
butt()
function auto(url){
document.forms[0]["url"+b].value=url
if(tim>200)
{document.forms[0]["txt"+b].value="链接超时"}
else
{document.forms[0]["txt"+b].value="时间"+tim/10+"秒"}
b++
}
function run(){for(var i=1;i<autourl.length;i++)document.write("<img

src=http://"+autourl+"/"+Math.random()+" width=1 height=1

onerror=auto('http://";;;+autourl+"')>")}
run()</script>

29. 各种样式的光标
auto :标准光标
default :标准箭头
hand :手形光标
wait :等待光标
text :I形光标
vertical-text :水平I形光标
no-drop :不可拖动光标
not-allowed :无效光标
help :?帮助光标
all-scroll :三角方向标
move :移动标
crosshair :十字标
e-resize
n-resize
nw-resize
w-resize
s-resize
se-resize
sw-resize
回复 支持 反对

使用道具 举报

 楼主| 发表于 2005-7-27 09:29:40 | 显示全部楼层
1、 去掉IE的滚动条
有时候做好的网页明明没有超出窗口,可IE却偏偏给加上滚动条,这样看上去很不舒服

,其实这也是可以通过一些小技巧避免的。具体如下:
<body style=”overflow-x:hidden”>…</body> //去掉X轴方向的滚动条
<body style=”overflow-y:hidden”>…</body> //去掉Y轴方向的滚动条
<body style=”overflow:hidden”>…</body> //去掉全部的滚动条
现在你看到的和你想像中的网页应该一样了吧,如果其中有什么不明白的地方可以参照

注释中的说明。

2、 使网页中的复制无效
有方法防止网页被保存了(参见《你别看我的源代码》),可不可以也防止网页内容被

复制呢?答案是当然可以。看看下面的例子你就会明白的。
<html>
<head>
<script language=”javascript”>
function nocopy() {
alert(“对不起,你不能非法复制本站内容”);
event.returnvalue=false;
}
</script>
</head>
<body oncopy=”nocopy()”>copyright by commander.</body>
</html>
这其实中是利用了document的一个oncopy事件,也就是说当发生复制事件时,弹出警告

框,同时事件(event)的返回值为false使oncopy事件失效,从而达到防止复制的目的



3、 用脚本控制浏览器
看到标题是不是有点不相信,那么试试下面的这几个例子吧!你一定会吃惊的。
在<body>和</body>之间加入如下代码:
<button onclick=”document.execCommand(‘open’)”>打开</button>
<button onclick=”document.execCommand(‘saveas’)”>另存为…</button>
<button onclick=”document.execCommand(‘print’)”>打印</button>
上面其实都是利用了document.execCommand()这个内置的函数,其参数为相应的浏览器

命令,还有很多命令就留给大家自己发现吧!

4、 IFrame也可以编辑文字
有没有想过除了表单(<form>)之外还有其它的网页元素可以编辑文字呢?只要使用IFram

e的隐藏的一个属性就可以使IFrame成为一个文本编辑器。
<html>
<body onload=”editer.document.designMode=’On’”>
<IFrame ID=”editer”></IFrame>
</body>
</html>
其中designMode属性表示IFrame的设计模式的状态(开/关),还在犹豫什么呢,快试试

吧!
只要巧妙的利用这一特性就可以制作很多意想不到的效果。如果下面我们来做一个图片

编辑器。
<html>
<body onload=”imgEditer.document.designMode=’On’;imgEditer.document.write(

‘<img src=图片.gif>’)”>
<IFrame id=”imgEditer”></IFrame>
</body>
</html>
用鼠标点击图片是不是有新的发现,其实大家只要利用自己的想象和充分利用这个属性

一定能做出更多的花样来,别忘了到时候有什么新的东东,告诉我一声呀!(Email:Bl

uePBoy@yesky.com

5、 打开硬盘
这是打开硬盘的另一种方法,把它写出来只是想告诉大家,要达到同一个目的有很多种

方法,这里就是利用了表单的Action属性达到的,其实打开硬盘有很多种方法,只是这

种不太被人们注意,所以这里就选择了这种方法。
<form action=file ://c|><input type=”submit” value=”打开C盘”></form>
回复 支持 反对

使用道具 举报

 楼主| 发表于 2005-7-27 09:32:21 | 显示全部楼层
弹出网页窗口全攻略

1.弹启一个全屏窗口 <html> <body

onload="window.open('http://www.pconline.com.cn','example01','fullscreen');">

; <b>www.e3i5.com</b> </body> </html>   2.弹启一个被F11化后的窗口 <html>

<body

onload="window.open(''http://www.pconline.com.cn','example02','channelmode');

">; <b>www.e3i5.com</b> </body> </html>   3.弹启一个带有收藏链接工具栏的窗

口 <html> <body

onload="window.open('http://www.pconline.com.cn','example03','width=400,heigh

t=300,directories');"> <b>www.e3i5.com</b> </body> </html>   4.网页对话框

<html> <SCRIPT LANGUAGE="javascript"> <!--

showModalDialog('http://www.pconline.com.cn','example04','dialogWidth:400px;d

ialogHeight:300px;

dialogLeft:200px;dialogTop:150px;center:yes;help:yes;resizable:yes;status:yes

') //--> </SCRIPT> <b>www.e3i5.com</b> </body> </html> <html> <SCRIPT

LANGUAGE="javascript"> <!--

showModelessDialog('http://www.pconline.com.cn','example05','dialogWidth:400p

x;dialogHeight:300px;

dialogLeft:200px;dialogTop:150px;center:yes;help:yes;resizable:yes;status:yes

') //--> </SCRIPT> <b>http://www.pconline.com.cn</b> </body> </html>

  showModalDialog()或是showModelessDialog()

来调用网页对话框,至于showModalDialog()与showModelessDialog()的区别,在于show

ModalDialog()打开的窗口(简称模式窗口),置在父窗口上,必须关闭才能访问父窗口

(建议尽量少用,以免招人反感);showModelessDialog()(简称无模式窗口),打开后

不必关闭也可访问父窗口打开的窗口。 dialogHeight: iHeight 设置对话框窗口的高度

。 dialogWidth: iWidth 设置对话框窗口的宽度。    dialogLeft: iXPos 设置对话

框窗口相对于桌面左上角的left位置。 dialogTop: iYPos 设置对话框窗口相对于桌面

左上角的top位置。 center: {yes | no | 1 | 0 } 指定是否将对话框在桌面上居中,

默认值是“yes”。 help: {yes | no | 1 | 0 } 指定对话框窗口中是否显示上下文敏

感的帮助图标。默认值是“yes”。    resizable: {yes | no | 1 | 0 } 指定是否

对话框窗口大小可变。默认值是“no”。 status: {yes | no | 1 | 0 } 指定对话框窗

口是否显示状态栏。对于非模式对话框窗口,默认值是“yes”;对于模式对话框窗口,

默认值是 “no”。 5.HTA窗口   HTA的全名为HTML Application,翻译过来就是HTML

应用程序,你只要简单的用.hta为扩展名保存HTML页面就算创建了一个HTA文件,下面我

们就用HTA来编个窗口,将以下这段代码保存为.hta文件,然后再用浏览器打开。

<HTML> <HEAD> <TITLE>www.e3i5.com</TITLE> <HTA:APPLICATION ID="oHTA"

APPLICATIONNAME="myApp"   BORDER="thin"   BORDERSTYLE="normal"

  CAPTION="yes"   ICON="filename.ico"   MAXIMIZEBUTTON="yes"

  MINIMIZEBUTTON="yes"   SHOWINTASKBAR="no"   INGLEINSTANCE="no"

  SYSMENU="yes"   VERSION="1.0"   WINDOWSTATE="normal" /> </HEAD>

<BODY> <b>http://www.pconline.com.cn</b> </BODY> </HTML>   有人会发现上面这

些代码与平时的html有点不同,多了HTA:APPLICATION标签,这就是关键之处,hta通过

它来提供一系列面向应用程序的功能,接下来再讲一讲它的属性(我的头又在发胀)  

 APPLICATIONNAME属性(applicationName)   此属性为设置HTA的名称。  BORDER

属性(border)   此属性为设置为HTA的窗口边框类型,默认值为 thick。  它可以

设为 thick 指定窗口为粗边框        dialog window 指定窗口为对话框 

       none 指定窗口无边框        thin 指定窗口为窄边框

  BORDERSTYLE属性(borderStyle)   此属性为设置HTA窗口的边框格式,默认值为

normal。  它可以设为    normal 普通边框格式   complex 凹凸格式组合边框

   raised 凸出的3D边框   static 3D边框格式   sunken 凹进的3D边框

  CAPTION属性(caption)   此属性为设置HTA窗口是否显示标题栏或标题,默认值

为 yes。   ICON属性(icon)   此属性为设置应用程序的图标。

  MAXIMIZEBUTTON属性(maximizeButton)   此属性为设置是否在HTA窗口中显示最

大化按钮,默认值为 yes。   MINIMIZEBUTTON属性(minimizeButton)   此属性为

设置是否在HTA窗口中显示最小化按钮,默认值为 yes。

  SHOWINTASKBAR属性(showInTaskBar)   此属性为设置是否在任务栏中显示此应用

程序,默认值为 yes。   SINGLEINSTANCE属性(singleInstance)   此属性为设置

是否此应用程序同时只能运行一次。次属性以APPLICATIONNAME属性作为标识,默认值为

no。   SYSMENU属性(sysMenu)   此属性为设置是否在HTA窗口中显示系统菜单,默

认值为 yes。   VERSION属性(version)   此属性为设置应用程序的版本,默认值

为空。   WINDOWSTATE属性(windowState)   此属性为设置HTA窗口的初始大小,默

认值为 normal。  它可以设为 normal 默认大小        minmize 最小化 

       maximize 最大化   以上括号中的是在脚本引用的属性。在脚本中以上

属性皆为只读属性。此外,在脚本中还可以使用commandLine属性来检索应用程序启动时

的参数。  在HTA中还可以继续使用html中的绝大多数标签、脚本等。
回复 支持 反对

使用道具 举报

 楼主| 发表于 2005-7-27 09:33:10 | 显示全部楼层
Meta标签详解

引言
  您的个人网站即使做得再精彩,在“浩瀚如海”的网络空间中,也如一叶扁舟不易

为人发现,如何推广
个人网站,人们首先想到的方法无外乎以下几种:
  
  ● 在搜索引擎中登录自己的个人网站
  ● 在知名网站加入你个人网站的链接
  ● 在论坛中发帖子宣传你的个人网站
  很多人却忽视了HTML标签META的强大功效,一个好的META标签设计可以大大提高你

的个人网站被搜索到
的可能性,有兴趣吗,谁我来重新认识一下META标签吧!
  META标签是HTML语言HEAD区的一个辅助性标签,它位于HTML文档头部的<HEAD>标记

和<TITLE>标记之间,
它提供用户不可见的信息。meta标签通常用来为搜索引擎robots定义页面主题,或者是

定义用户浏览器上的
cookie;它可以用于鉴别作者,设定页面格式,标注内容提要和关键字;还可以设置页

面使其可以根据你定
义的时间间隔刷新自己,以及设置RASC内容等级,等等。
详细介绍
  下面介绍一些有关 标记的例子及解释。
  META标签分两大部分:HTTP-EQUIV和NAME变量。
★HTTP-EQUIV
  HTTP-EQUIV类似于HTTP的头部协议,它回应给浏览器一些有用的信息,以帮助正确

和精确地显示网页内容
。常用的HTTP-EQUIV类型有:
  1、Content-Type和Content-Language (显示字符集的设定)
   说明:设定页面使用的字符集,用以说明主页制作所使用的文字已经语言,浏览

器会根据此来调用相应
      的字符集显示page内容。
   用法:<Meta http-equiv="Content-Type" Content="text/html;

Charset=gb2312">
      <Meta http-equiv="Content-Language" Content="zh-CN">
   注意:该META标签定义了HTML页面所使用的字符集为GB2132,就是国标汉字码。

如果将其中
      的“charset=GB2312”替换成“BIG5”,则该页面所用的字符集就是繁体

中文Big5码。
      当你浏览一些国外的站点时,IE浏览器会提示你要正确显示该页面需要下

载xx语支持。
      这个功能就是通过读取HTML页面META标签的Content-Type属性而得知需要

使用哪种字
      符集显示该页面的。如果系统里没有装相应的字符集,则IE就提示下载。

其他的语言
      也对应不同的charset,比如日文的字符集是“iso-2022-jp ”,韩文的是

“ks_c_5601”。
      
      Content-Type的Content还可以是:text/xml等文档类型;
      Charset选项:ISO-8859-1、BIG5、UTF-8、SHIFT-Jis、Euc、Koi8-2、us-

ascii,
             x-mac-roman, iso-8859-2, x-mac-ce, iso-2022-jp,

x-sjis, x-euc-jp,
             euc-kr, iso-2022-kr, gb2312, gb_2312-80, x-euc-tw,

x-cns11643-1,
             x-cns11643-2等字符集;
      Content-Language的Content还可以是:EN、FR等语言代码。
  2、Refresh (刷新)
   说明:让网页多长时间(秒)刷新自己,或在多长时间后让网页自动链接到其它

网页。
   用法:<Meta http-equiv="Refresh" Content="30">
      <Meta http-equiv="Refresh" Content="5; Url=http://www.xia8.net">
   注意:其中的5是指停留5秒钟后自动刷新到URL网址。
  3、Expires (期限)
   说明:指定网页在缓存中的过期时间,一旦网页过期,必须到服务器上重新调阅


   用法:<Meta http-equiv="Expires" Content="0">
      <Meta http-equiv="Expires" Content="Wed, 26 Feb 1997 08:21:57

GMT">
   注意:必须使用GMT的时间格式,或直接设为0(数字表示多少时间后过期)。
  4、Pragma (cach模式)
   说明:禁止浏览器从本地机的缓存中调阅页面内容。
   用法:<Meta http-equiv="Pragma" Content="No-cach">
   注意:这样设定,访问者将无法脱机浏览。
  5、Set-Cookie (cookie设定)
   说明:浏览器访问某个页面时会将它存在缓存中,下次再次访问时就可从缓存中

读取,以提高速度。
      当你希望访问者每次都刷新你广告的图标,或每次都刷新你的计数器,就

要禁用缓存了。通
      常HTML文件没有必要禁用缓存,对于ASP等页面,就可以使用禁用缓存,因

为每次看到的页面
      都是在服务器动态生成的,缓存就失去意义。如果网页过期,那么存盘的c

ookie将被删除。
   用法:<Meta http-equiv="Set-Cookie" Content="cookievalue=xxx;

expires=Wednesday,
       21-Oct-98 16:14:21 GMT; path=/">
   注意:必须使用GMT的时间格式。
  6、Window-target (显示窗口的设定)
   说明:强制页面在当前窗口以独立页面显示。
   用法:<Meta http-equiv="Widow-target" Content="_top">
   注意:这个属性是用来防止别人在框架里调用你的页面。Content选项:_blank、

_top、_self、_parent。
  7、Pics-label (网页RSAC等级评定)
   说明:在IE的Internet选项中有一项内容设置,可以防止浏览一些受限制的网站

,而网站的限制级
      别就是通过该参数来设置的。
   用法:<META http-equiv="Pics-label"

Contect="(PICS-1.1'http://www.rsac.org/ratingsv01.html'
       I gen comment 'RSACi North America Sever' by

'inet@microsoft.com' for 'http://www.
      microsoft.com' on '1997.06.30T14:21-0500' r(n0 s0 v0 l0))">
   注意:不要将级别设置的太高。RSAC的评估系统提供了一种用来评价Web站点内容

的标准。用户可以
      设置Microsoft Internet Explorer(IE3.0以上)来排除包含有色情和暴

力内容的站点。上面
      这个例子中的HTML取自Microsoft的主页。代码中的(n 0 s 0 v 0 l 0)

表示该站点不包含不
      健康内容。级别的评定是由RSAC,即美国娱乐委员会的评级机构评定的,

如果你想进一步了解
      RSAC评估系统的等级内容,或者你需要评价自己的网站,可以访问RSAC的

站点:http://www.rsac.org/

  8、Page-Enter、Page-Exit (进入与退出)
   说明:这个是页面被载入和调出时的一些特效。
   用法:<Meta http-equiv="Page-Enter" Content="blendTrans(Duration=0.5)">
      <Meta http-equiv="Page-Exit" Content="blendTrans(Duration=0.5)">
   注意:blendTrans是动态滤镜的一种,产生渐隐效果。另一种动态滤镜RevealTra

ns也可以用于页面
      进入与退出效果:

      <Meta http-equiv="Page-Enter" Content="revealTrans(duration=x,

transition=y)">
      <Meta http-equiv="Page-Exit" Content="revealTrans(duration=x,

transition=y)">
       Duration  表示滤镜特效的持续时间(单位:秒)
       Transition 滤镜类型。表示使用哪种特效,取值为0-23。

       0 矩形缩小
       1 矩形扩大
       2 圆形缩小
       3 圆形扩大
       4 下到上刷新
       5 上到下刷新
       6 左到右刷新
       7 右到左刷新
       8 竖百叶窗
       9 横百叶窗
       10 错位横百叶窗
       11 错位竖百叶窗
       12 点扩散
       13 左右到中间刷新
       14 中间到左右刷新
       15 中间到上下
       16 上下到中间
       17 右下到左上
       18 右上到左下
       19 左上到右下
       20 左下到右上
       21 横条
       22 竖条
       23 以上22种随机选择一种
  9、MSThemeCompatible (XP主题)
   说明:是否在IE中关闭 xp 的主题
   用法:<Meta http-equiv="MSThemeCompatible" Content="Yes">
   注意:关闭 xp 的蓝色立体按钮系统显示样式,从而和win2k 很象。
  10、IE6 (页面生成器)
   说明:页面生成器generator,是ie6
   用法:<Meta http-equiv="IE6" Content="Generator">
   注意:用什么东西做的,类似商品出厂厂商。
  11、Content-Script-Type (脚本相关)
   说明:这是近来W3C的规范,指明页面中脚本的类型。
   用法:<Meta http-equiv="Content-Script-Type" Content="text/javascript">
   注意:
回复 支持 反对

使用道具 举报

 楼主| 发表于 2005-7-27 09:33:37 | 显示全部楼层
★NAME变量
  1、Keywords (关键字)
   说明:为搜索引擎提供的关键字列表
   用法:<Meta name="Keywords" Content="关键词1,关键词2,关键词3,关键词4,

……">
   注意:各关键词间用英文逗号“,”隔开。META的通常用处是指定搜索引擎用来提

高搜索质量的关键
      词。当数个META元素提供文档语言从属信息时,搜索引擎会使用lang特性

来过滤并通过用户的
      语言优先参照来显示搜索结果。例如:
      <Meta name="Kyewords" Lang="EN"

Content="vacation,greece,sunshine">
      <Meta name="Kyewords" Lang="FR" Content="vacances,grè:ce,soleil">
  2、Description (简介)
   说明:Description用来告诉搜索引擎你的网站主要内容。
   用法:<Meta name="Description" Content="你网页的简述">
   注意:
  3、Robots (机器人向导)
   说明:Robots用来告诉搜索机器人哪些页面需要索引,哪些页面不需要索引。Con

tent的参数有all、
      none、index、noindex、follow、nofollow。默认是all。
   用法:<Meta name="Robots"

Content="All|None|Index|Noindex|Follow|Nofollow">
   注意:许多搜索引擎都通过放出robot/spider搜索来登录网站,这些robot/spide

r就要用到meta元素
      的一些特性来决定怎样登录。

    all:文件将被检索,且页面上的链接可以被查询;(和 "noindex, no follow"

起相同作用)
    none:文件将不被检索,且页面上的链接不可以被查询;
    index:文件将被检索;(让robot/spider登录)
    follow:页面上的链接可以被查询;
    noindex:文件将不被检索,但页面上的链接可以被查询;(不让robot/spider

登录)
   nofollow:文件将不被检索,页面上的链接可以被查询。(不让robot/spider顺

着此页的连接往下探
        找)
  4、Author (作者)
   说明:标注网页的作者或制作组
   用法:<Meta name="Author" Content="张三,abc@sina.com">
   注意:Content可以是:你或你的制作组的名字,或Email
  5、Copyright (版权)
   说明:标注版权
   用法:<Meta name="Copyright" Content="本页版权归Zerospace所有。All

Rights Reserved">
   注意:
  6、Generator (编辑器)
   说明:编辑器的说明
   用法:<Meta name="Generator" Content="PCDATA|FrontPage|">
   注意:Content="你所用编辑器"
  7、revisit-after (重访)
   说明:
   用法:<META name="revisit-after" CONTENT="7 days" >
   注意:
回复 支持 反对

使用道具 举报

 楼主| 发表于 2005-7-27 09:34:01 | 显示全部楼层
★Meta的其它一些用法
  1、Link (链接)
   说明:链接到文件
   用法:<Link href="soim.ico" rel="Shortcut Icon">
   注意:很多网站如果你把她保存在收件夹中后,会发现它连带着一个小图标,如

果再次点击进入之后
      还会发现地址栏中也有个小图标。现在只要在你的页头加上这段话,就能

轻松实现这一功能。
      <LINK> 用来将目前文件与其它 URL 作连结,但不会有连结按钮,用於

<HEAD> 标记间, 格
      式如下:
       <link href="URL" rel="relationship">
       <link href="URL" rev="relationship">
  2、Base (基链接)
   说明:插入网页基链接属性
   用法:<Base href="http://www.xia8.net/" target="_blank">
   注意:你网页上的所有相对路径在链接时都将在前面加上“http://www.cn8cn.co

m/”。其中target=
"_blank"是链接文件在新的窗口中打开,你可以做其他设置。将“_blank”改为“_pare

nt”是
链接文件将在当前窗口的父级窗口中打开;改为“_self”链接文件在当前窗口(帧)中

打开;
改为“_top”链接文件全屏显示。
  以上是META标签的一些基本用法,其中最重要的就是:Keywords和Description的设

定。为什么呢?道理
很简单,这两个语句可以让搜索引擎能准确的发现你,吸引更多的人访问你的站点!根据

现在流行搜索引擎
(Google,Lycos,AltaVista等)的工作原理,搜索引擎先派机器人自动在WWW上搜索,当

发现新的网站时,便
检索页面中的Keywords和Description,并将其加入到自己的数据库,然后再根据关键词

的密度将网站排序。
  由此看来,我们必须记住添加Keywords和Description的META标签,并尽可能写好关

键字和简介。否则,
后果就会是:
  
  ● 如果你的页面中根本没有Keywords和Description的META标签,那么机器人是无

法将你的站点加入数
    据库,网友也就不可能搜索到你的站点。
  ● 如果你的关键字选的不好,关键字的密度不高,被排列在几十甚至几百万个站

点的后面被点击的可
    能性也是非常小的。
  写好Keywords(关键字)要注意以下几点:
  ● 不要用常见词汇。例如www、homepage、net、web等。
  ● 不要用形容词,副词。例如最好的,最大的等。
  ● 不要用笼统的词汇,要尽量精确。例如“爱立信手机”,改用“T28SC”会更好


  “三人之行,必有我师”,寻找合适关键词的技巧是:到Google、Lycos、Alta等著

名搜索引擎,搜索与
你的网站内容相仿的网站,查看排名前十位的网站的META关键字,将它们用在你的网站

上,效果可想而知了。
  ◆小窍门
  为了提高搜索点击率,这里还有一些“捷径”可以帮得到你:
  ● 为了增加关键词的密度,将关键字隐藏在页面里(将文字颜色定义成与背景颜色

一样)。
  ● 在图像的ALT注释语句中加入关键字。如:<IMG SRC="xxx.gif"

Alt="Keywords">
  ● 利用HTML的注释语句,在页面代码里加入大量关键字。用法: <!-- 这里插入

关键字 -->
  Meta:它可以记录当前页面的信息,例如字符编码、作者、版权和关键字等。还可以

用来向服务器提供信息,
例如截止日期和页面刷新间隔等。
  Attribute:指定META标签是否包含页面描述信息(NAME)或HTTP标题信息(HTTP

EQUIV)。
    Value:指定所提供信息的类型。有些值是已经定义好的,在DW中有专门的属性

检查器。例如description
       (说明)、keyword(关键字)、refresh(刷新)等。还可以指定其他任意值

,如:creationdate(创建
日期) 、document ID(文档编号)和level(等级)等。
   Content:实际内容。如:如果指定level(等级)为Value(值),则Content可能是be

ginner(初级)、
       intermediate(中级)、advanced(高级)。

<head>
  <title>文件头,显示在浏览器标题区</title>
  <meta http-equiv="Content-Language" content="zh-cn">
  <meta http-equiv="Content-Type" content="text/html; charset=gb2312">
  <meta name="GENERATOR" content="Microsoft FrontPage 4.0">
  <meta name="ProgId" content="FrontPage.Editor.Document">
  <meta name="制作人" content="唐蓉生">
  <meta name="主题词" content="HTML 网页制作 课件">
</head>
回复 支持 反对

使用道具 举报

 楼主| 发表于 2005-7-27 09:34:52 | 显示全部楼层
在线播放器代码大全


1.avi格式
<object id="video" width="400" height="200" border="0"
classid="clsid:CFCDAA03-8BE4-11cf-B84B-0020AFBBCCFA">
<param name="ShowDisplay" value="0">
<param name="ShowControls" value="1">
<param name="AutoStart" value="1">
<param name="AutoRewind" value="0">
<param name="PlayCount" value="0">
<param name="Appearance value="0 value=""">
<param name="BorderStyle value="0 value=""">
<param name="MovieWindowHeight" value="240">
<param name="MovieWindowWidth" value="320">
<param name="FileName" value="file:///D|/work/vod/Mbar.avi">
<embed width="400" height="200" border="0" showdisplay="0"
showcontrols="1" autostart="1" autorewind="0" playcount="0"
moviewindowheight="240" moviewindowwidth="320"
filename="file:///D|/work/vod/Mbar.avi" src="Mbar.avi">
</embed>
</object>
2.mpg格式
<object classid="clsid:05589FA1-C356-11CE-BF01-00AA0055595A"
id="ActiveMovie1" width="239" height="250">
<param name="Appearance" value="0">
<param name="AutoStart" value="-1">
<param name="AllowChangeDisplayMode" value="-1">
<param name="AllowHideDisplay" value="0">
<param name="AllowHideControls" value="-1">
<param name="AutoRewind" value="-1">
<param name="Balance" value="0">
<param name="CurrentPosition" value="0">
<param name="DisplayBackColor" value="0">
<param name="DisplayForeColor" value="16777215">
<param name="DisplayMode" value="0">
<param name="Enabled" value="-1">
<param name="EnableContextMenu" value="-1">
<param name="EnablePositionControls" value="-1">
<param name="EnableSelectionControls" value="0">
<param name="EnableTracker" value="-1">
<param name="Filename" value="../../../mpeg/halali.mpg" valuetype="ref">
<param name="FullScreenMode" value="0">
<param name="MovieWindowSize" value="0">
<param name="PlayCount" value="1">
<param name="Rate" value="1">
<param name="SelectionStart" value="-1">
<param name="SelectionEnd" value="-1">
<param name="ShowControls" value="-1">
<param name="ShowDisplay" value="-1">
<param name="ShowPositionControls" value="0">
<param name="ShowTracker" value="-1">
<param name="Volume" value="-480">
</object>
3.rm格式
<OBJECT ID=video1 CLASSID="clsid:CFCDAA03-8BE4-11cf-B84B-0020AFBBCCFA"
HEIGHT=288 WIDTH=352>
<param name="_ExtentX" value="9313">
<param name="_ExtentY" value="7620">
<param name="AUTOSTART" value="0">
<param name="SHUFFLE" value="0">
<param name="PREFETCH" value="0">
<param name="NOLABELS" value="0">
<param name="SRC" value="rtsp://203.207.131.35/vod/dawan-a.rm";;>
<param name="CONTROLS" value="ImageWindow">
<param name="CONSOLE" value="Clip1">
<param name="LOOP" value="0">
<param name="NUMLOOP" value="0">
<param name="CENTER" value="0">
<param name="MAINTAINASPECT" value="0">
<param name="BACKGROUNDCOLOR" value="#000000"><embed SRC
type="audio/x-pn-realaudio-plugin" CONSOLE="Clip1" CONTROLS="ImageWindow"
HEIGHT="288" WIDTH="352" AUTOSTART="false">
</OBJECT>
4.wmv格式
<object id="NSPlay" width=200 height=180
classid="CLSID:22d6f312-b0f6-11d0-94ab-0080c74c7e95"
codebase="http://activex.microsoft.com/act ... layer/en/nsmp2inf.c

ab#Version=6,4,5,715"
standby="Loading Microsoft Windows Media Player components..."
type="application/x-oleobject" align="right" hspace="5">
<!-- ASX File Name -->
<param name="AutoRewind" value=1>
<param name="FileName" value="xxxxxx.wmv">
<!-- Display Controls -->
<param name="ShowControls" value="1">
<!-- Display Position Controls -->
<param name="ShowPositionControls" value="0">
<!-- Display Audio Controls -->
<param name="ShowAudioControls" value="1">
<!-- Display Tracker Controls -->
<param name="ShowTracker" value="0">
<!-- Show Display -->
<param name="ShowDisplay" value="0">
<!-- Display Status Bar -->
<param name="ShowStatusBar" value="0">
<!-- Diplay Go To Bar -->
<param name="ShowGotoBar" value="0">
<!-- Display Controls -->
<param name="ShowCaptioning" value="0">
<!-- Player Autostart -->
<param name="AutoStart" value=1>
<!-- Animation at Start -->
<param name="Volume" value="-2500">
<param name="AnimationAtStart" value="0">
<!-- Transparent at Start -->
<param name="TransparentAtStart" value="0">
<!-- Do not allow a change in display size -->
<param name="AllowChangeDisplaySize" value="0">
<!-- Do not allow scanning -->
<param name="AllowScan" value="0">
<!-- Do not show contect menu on right mouse click -->
<param name="EnableContextMenu" value="0">
<!-- Do not allow playback toggling on mouse click -->
<param name="ClickToPlay" value="0">
</object>
最简单的播放代码
<embed
src="http://wmt2.aboutmedia.com.tw/Ab ... aying-021011_01v_12

0k.wmv";;;
autostart="true" loop="true" width="200" height="150" >
把这个网址http://wmt2.aboutmedia.com.tw/Ab ... mtv/naying-021011_0

1v_120k.wmv换成你要看的电影就行了
有图像的rm格式:
<OBJECT classid=clsid:CFCDAA03-8BE4-11cf-B84B-0020AFBBCCFA height=288
id=video1 width=305 VIEWASTEXT>
<param name=_ExtentX value=5503>
<param name=_ExtentY value=1588>
<param name=AUTOSTART value=-1>
<param name=SHUFFLE value=0>
<param name=PREFETCH value=0>
<param name=NOLABELS value=0>
<param name=SRC value=http://media.cdut.edu.cn/ram/new/xiaoxin1.ram>
<param name=CONTROLS value=Imagewindow,StatusBar,ControlPanel>
<param name=CONSOLE value=RAPLAYER>
<param name=LOOP value=0>
<param name=NUMLOOP value=0>
<param name=CENTER value=0>
<param name=MAINTAINASPECT value=0>
<param name=BACKGROUNDCOLOR value=#000000>
</OBJECT>
无图像的rm格式:如相声,歌曲。。。
<object ID=video2 WIDTH=300 HEIGHT=62
CLASSID=CLSID:CFCDAA03-8BE4-11CF-B84B-0020AFBBCCFA>
<param name=_ExtentX value=9657>
<param name=_ExtentY value=847>
<param name=AUTOSTART value=-1>
<param name=SHUFFLE value=0>
<param name=PREFETCH value=0>
<param name=NOLABELS value=0>
<param name=SRC
;value=http://210.242.69.206/ramgen/broadcast/BCC/encoder/hipop.rm>
<param name=CONTROLS value=StatusBar,controlpanel>
<param name=CONSOLE value=Clip1>
<param name=LOOP value=0>
<param name=NUMLOOP value=0>
<param name=CENTER value=0>
<param name=MAINTAINASPECT value=0>
<param name=BACKGROUNDCOLOR value=#000000>
</object>
最简单的media格式的播放器。。自动识别有无图像,但是版本是你机器的!
<embed src=mms://61.175.132.221/tv/mtv/f4/makeawish.wmv width=200
height=200 autostart=true loop=true></embed>
有图像的media播放器,自动调用网上的插件。
<object id=nstv classid=CLSID:6BF52A52-394A-11d3-B153-00C04F79FAA6
width=280 height=265
codebase=http://activex.microsoft.com/activex/controls/mplayer/en/nsmp2inf.ca

b#Version=5,1,52,701standby=Loading
Microsoft? Windows Media? Player components...
type=application/x-oleobject>
<param name=URL value=http://202.99.11.42/xiangsheng/ymjr.wma>
<PARAM NAME=UIMode value=full><PARAM NAME=AutoStart value=true>
<PARAM NAME=Enabled value=true>
<PARAM NAME=enableContextMenu value=false>
<param name=WindowlessVideo value=true></object>
无图像的media播放器。。。同上。
<object id=nstv classid=CLSID:6BF52A52-394A-11d3-B153-00C04F79FAA6
width=280 height=60
codebase=http://activex.microsoft.com/activex/controls/mplayer/en/nsmp2inf.ca

b#Version=5,1,52,701standby=Loading
Microsoft? Windows Media? Player components...
type=application/x-oleobject>
<param name=URL value=http://202.99.11.42/xiangsheng/ymjr.wma>
<PARAM NAME=UIMode value=full><PARAM NAME=AutoStart value=true>
<PARAM NAME=Enabled value=true>
<PARAM NAME=enableContextMenu value=false>
</object>
只是界面不同的media的调插件播放器。。建议不用这个,,你可以看!
<embed src=http://av.wanwa.com/fileroot/AV/Ramfiles/23809.ram
type=audio/x-pn-realaudio-plugin console=Clip1
controls=ControlPanel,StatusBar height=60 width=275 autostart=true></embed>
在线播放r m格式视频代码:
<object id="player" name="player"
classid="clsid:CFCDAA03-8BE4-11cf-B84B-0020AFBBCCFA" width="400"
height="272">
<param name="_ExtentX" value="18415">
<param name="_ExtentY" value="9102">
<param name="AUTOSTART" value="-1">
<param name="SHUFFLE" value="0">
<param name="PREFETCH" value="0">
<param name="NOLABELS" value="-1">
<param name="SRC" value="http://www.xiaoqiong.com/ftp/up/bz.rm";>
<param name="CONTROLS" value="Imagewindow">
<param name="CONSOLE" value="clip1">
<param name="LOOP" value="0">
<param name="NUMLOOP" value="0">
<param name="CENTER" value="0">
<param name="MAINTAINASPECT" value="0">
<param name="BACKGROUNDCOLOR" value="#000000">
</object><br>
<object ID="RP2" CLASSID="clsid:CFCDAA03-8BE4-11cf-B84B-0020AFBBCCFA"
WIDTH="400" HEIGHT="57">
<param name="_ExtentX" value="18415">
<param name="_ExtentY" value="1005">
<param name="AUTOSTART" value="-1">
<param name="SHUFFLE" value="0">
<param name="PREFETCH" value="0">
<param name="NOLABELS" value="-1">
<param name="SRC" value="http://www.xiaoqiong.com/ftp/up/bz.rm";>
<PARAM NAME="CONTROLS" value="ControlPanel,StatusBar">
<param name="CONSOLE" value="clip1">
<param name="LOOP" value="0">
<param name="NUMLOOP" value="0">
<param name="CENTER" value="0">
<param name="MAINTAINASPECT" value="0">
<param name="BACKGROUNDCOLOR" value="#000000">
</object>
回复 支持 反对

使用道具 举报

您需要登录后才可以回帖 登录 | 注~册

本版积分规则

小黑屋|手机版|咖啡日语

GMT+8, 2024-10-2 12:05

Powered by Discuz! X3.4

© 2001-2017 Comsenz Inc.

快速回复 返回顶部 返回列表