网路学院,365源码网为网站站长、编程者提供资源!首页 | RSS订阅 | 365源码网

资讯首页网页制作

[导读]Dreamweaver升级到8.0.2后,插入Flash时的代码会有所改变,这是Macromedia为解决IE中的Flash会出现控件激活框而作的更新。要为Flash添加透明等参数有两种方法。用Dreamweaver的属性面板为插入的Flash添加透明属性,此方法简单实用。使插入的Flash处于选择状态,点击属性面板中的“参数”,在随即弹出的参数表中添加一行,参

 
 

Dreamweaver升级到8.0.2后,插入Flash时的代码会有所改变,这是Macromedia为解决IE中的Flash会出现控件激活框而作的更新。要为Flash添加透明等参数有两种方法。

用Dreamweaver的属性面板为插入的Flash添加透明属性,此方法简单实用。

使插入的Flash处于选择状态,点击属性面板中的“参数”,在随即弹出的参数表中添加一行,参数名为“wmode”,值为“transparent”。使用此方法时注意,若页面中有人工输入的Flash ID,此ID将被删除,请在添加完参数后重新输入ID。

 

 

在html代码中为插入的Flash添加透明属性。

同样是添加值为“transparent”的“wmode”参数。

<!--加载AC_RunActiveContent.js,此为DW自动生成的文件,无需修改,更改文件目录的时候记得修改这里的路径-->

<script src="Scripts/AC_RunActiveContent.js" type="text/javascript"></script>

<!--下面这段JS修改的时候要注意,一共要修改四个地方:

300 是宽度;

200 是高度;

images/killIEBorder 是路径和文件名,修改时注意,共有两处,还要特别注意,文件名后面不要加“.swf”,此后缀已经写在AC_RunActiveContent.js中-->

<script type="text/javascript">AC_FL_RunContent( 'codebase', 'http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0', 'width', '300', 'height', '200', 'src', 'images/killIEBorder', 'quality', 'high', 'pluginspage', 'http://www.macromedia.com/go/getflashplayer', 'wmode', 'transparent', 'movie', 'images/killIEBorder' ); //end AC code

</script>

<!--遇到浏览器禁用javascript时将调用下面这段< noscript></noscript>内的代码,就是Dreamweaver升级到8.0.2之前我们插入flash时的那段代码。<param> 标签针对IE起作用,<embed> 标签针对Firefox和Netscape起作用。-->

<noscript>

<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0" width="300" height="200">

<param name="movie" value="images/killIEBorder.swf">

<param name="quality" value="high">

<param name="wmode" value="transparent">

<embed src="images/killIEBorder.swf" width="300" height="200" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" wmode="transparent"></embed>

</object>

</noscript>

阅读全文

[导读]     相信很多人在打开娱乐网站或个人主页时,经常都会听到一些音乐。本例将介绍如何实现在网页上随机播放背景音乐。   效果说明 建立文件,循环插入要播放的音乐,便可制作出动感的背景音乐,而且是随机的。实际效果请浏览随书光盘中【源文件】下的对应文件。   创作思想 打开 Dreamweaver MX 2004 软件新建页面,再

 
 
     相信很多人在打开娱乐网站或个人主页时,经常都会听到一些音乐。本例将介绍如何实现在网页上随机播放背景音乐。

  效果说明 建立文件,循环插入要播放的音乐,便可制作出动感的背景音乐,而且是随机的。实际效果请浏览随书光盘中【源文件】下的对应文件。

  创作思想 打开 Dreamweaver MX 2004 软件新建页面,再选择【行为】面板下的【 + 】选项插播音乐,设置参数。然后重复此操作 4 次,就可以随机播放背景音乐。

  操作步骤

  ( 1 )打开 Dreamweaver MX 2004 软件新建文件,并保存页面。

  ( 2 )选择好“标签”页,在“行为”面板中插入要播放的音乐文件,如图 55-1 所示。


  ( 3 )接着选择插入的声音文件,打开参数窗口,设置其参数,如图 55-2 所示。


  ( 4 )重复执行图 55-1 和图 55-2 所示的操作 4 次,这样就添加了 4 种音乐,使得程序可以随机在这四种音乐中挑选其中一首来播放。因此,图 55-1 中所示的第四步操作要选择不同的音乐文件。

  ( 5 )保存文件,完成操作。适当放置轻松的音乐背景,可以让用户感觉更轻松、愉快
阅读全文

[导读]我们在网页制作过程中,尤其是初学的人们读喜欢给自己的网页制作一个背景,今天我给大家讲解一下在Dreamweaver8中设置网页背景的方法。   首先启动Dreamweaver软件,新建立一个HTMl文档。   然后我们执行“修改”=>“页面属性”(快捷键Ctrl+J)菜单命令,弹出“页面属性”对话框,在“外观”分类中会发现背景图像的下

 
 
我们在网页制作过程中,尤其是初学的人们读喜欢给自己的网页制作一个背景,今天我给大家讲解一下在Dreamweaver8中设置网页背景的方法。

  首先启动Dreamweaver软件,新建立一个HTMl文档。

  然后我们执行“修改”=>“页面属性”(快捷键Ctrl+J)菜单命令,弹出“页面属性”对话框,在“外观”分类中会发现背景图像的下方多了一个“重复”选项,可以选择不重复(no-repeat)、重复(repeat)、横向重复(repeat-x)、纵向重复(repeat-y),如图所示。


  单击“背景图像”后的浏览按钮,找到一幅图片作为网页的背景,然后来看看四种不同选项所带来的不同背景图像。首先选择“不重复”选项,它的含义是背景图片不重复显示,只显示图像的原始大小,而且只显示一次,如图所示。在以前版本中,只要设置了网页背景图像,它就会平铺显示在网页中,现在我们对背景图像的可控性更强了。


  如果选中“重复”选项,则会在x和y方向重复显示背景图像,就和以前的老版本中一样,如图所示。


  如果选中“横向重复”选项,则会在x轴方向重复显示背景图像,如图所示。


  如果选中“纵向重复”选项,则会在y轴方向重复显示背景图像,如图所示。


  当你制作网页的时候来试试该方法吧!
阅读全文

[导读]漂亮的Flash动画人人喜欢,不过制作起来的确有一些技术难度。你知道吗,Dreamweaver作为一个网页制作工具,还可以创建好玩的Flash相册。今天我们就来利用它来制作一个简单、漂亮的Flash相册,最终效果如图1。图1插入Flash元素运行Dreamweaver,点击菜单“插入”→“媒体”→“图像查看器”,系统会自动弹出“保存Flash元素”

 
 

漂亮的Flash动画人人喜欢,不过制作起来的确有一些技术难度。你知道吗,Dreamweaver作为一个网页制作工具,还可以创建好玩的Flash相册。今天我们就来利用它来制作一个简单、漂亮的Flash相册,最终效果如图1。

 

 

 

图1

 

插入Flash元素

运行Dreamweaver,点击菜单“插入”→“媒体”→“图像查看器”,系统会自动弹出“保存Flash元素”对话框,键入保存的文件名,例如:“Photo.swf”,点击“保存”按钮完成。

现在一个Flash元素就被插入网页中了,为满足实际需要,下面我们需要进行简单的参数设置。鼠标点击编辑窗口中的“Flash元素”,在属性面板中重新设置动画的宽、高值为实际所需,如图2。

 

 

图2

 

 

Flash元素参数设置

下面我们还需要设置“Flash元素”的参数,为Flash相册指定调用的图片、设置相册外观。点击菜单“窗口”→“标签检查器”,现在我们可以Dreamweaver右栏中看到一个“Flash元素”面板,如图3。

 

图3

这里可供选择的参数很多,下面我们主要讲几个基本的设置值。

imageURLs,该值用于设置调用的图片位置,我们一般将调用的图片放在同保存的“Photo.swf”文件同一文件夹为佳。鼠标点击imageURLs项目的值,系统自动在参数右侧增加“编辑数组值”按钮,点击进入,如图4。

 

图4

进入“编辑"imageURLs"数组对话框”,系统默认内置了三组数值,我们可以点击“+”号增加新的数值,每一组的数值同需要调用的图片文件名一一对应即可,如图5。

 

图5

其它“Flash元素”的参数设置方法基本同上,下面我们列一下几个重要的参数:

imageLinks,设置点击每张图片后访问的网址。

showControls,定义是否显示Flash相册的播放控制按钮。

slideAutoPlay,定义Flash相册是否自动播放。

transitionsType:定义Flash相册过渡效果的类型,默认为随机效果:Random。

title、titleColor、titleFont、titleSize:添加自定义的相册标题、颜色、字体、大小等值。

frameShow、frameThickness、frameColor:用于定义Flash相册是否有边框及边框宽度、颜色值。

注:Dreamweaver会在保存相册的文件夹中自动生成一个Scripts文件夹,上传网页时要记住一起上传。

阅读全文

[导读]     本文介绍如何在Dreamweaver 中使用层叠样式表 (CSS) 设置页面中的文本格式。您可以使用 CSS 以 HTML 无法提供的方式来设置文本格式和定位文本,从而能更加灵活自如地控制页面的外观。  了解 CSS  层叠样式表 (CSS) 是一系列格式设置规则,它们控制 Web 页面内容的外观。使用 CSS 设置页面格式时,内容与表现形式是

 
 
     本文介绍如何在Dreamweaver 中使用层叠样式表 (CSS) 设置页面中的文本格式。您可以使用 CSS 以 HTML 无法提供的方式来设置文本格式和定位文本,从而能更加灵活自如地控制页面的外观。

  了解 CSS

  层叠样式表 (CSS) 是一系列格式设置规则,它们控制 Web 页面内容的外观。使用 CSS 设置页面格式时,内容与表现形式是相互分开的。页面内容(HTML 代码)位于自身的 HTML 文件中,而定义代码表现形式的 CSS 规则位于另一个文件(外部样式表)或 HTML 文档的另一部分(通常为 部分)中。使用 CSS 可以非常灵活并更好地控制页面的外观,从精确的布局定位到特定的字体和样式等。

  CSS 使您可以控制许多仅使用 HTML 无法控制的属性。例如,您可以为所选文本指定不同的字体大小和单位(像素、磅值等)。通过使用 CSS 从而以像素为单位设置字体大小,还可以确保在多个浏览器中以更一致的方式处理页面布局和外观。

  CSS 格式设置规则由两部分组成:选择器和声明。选择器是标识已设置格式元素(如 P、H1、类名称或 ID)的术语,而声明则用于定义样式元素。在下面的示例中,H1 是选择器,介于大括号 ({}) 之间的所有内容都是声明:

以下是引用片段:
  H1 {
  font-size:16 pixels;
  font-family:Helvetica;
  font-weight:bold;
  }

  声明由两部分组成:属性(如 font-family)和值(如 Helvetica)。上述示例为 H1 标签创建了样式:链接到此样式的所有 H1 标签的文本都将是 16 像素大小并使用 Helvetica 字体和粗体。

  术语"层叠"是指对同一个元素或 Web 页面应用多个样式的能力。例如,可以创建一个 CSS 规则来应用颜色,创建另一个规则来应用边距,然后将两者应用于一个页面中的同一文本。所定义的样式"层叠"到您的 Web 页面上的元素,并最终创建您想要的设计。

  CSS 的主要优点是容易更新;只要对一处 CSS 规则进行更新,则使用该定义样式的所有文档的格式都会自动更新为新样式。

  在 Dreamweaver 中可以定义以下规则类型:

  自定义 CSS 规则(也称为"类样式")使您可以将样式属性应用到任何文本范围或文本块。所有类样式均以句点 (.) 开头。例如,您可以创建称为 .red 的类样式,设置规则的 color 属性为红色,然后将该样式应用到一部分已定义样式的段落文本中。

  HTML 标签规则重定义特定标签(如 p 或 h1)的格式。创建或更改 h1 标签的 CSS 规则时,所有用 h1 标签设置了格式的文本都会立即更新。

  CSS 选择器规则(高级样式)重定义特定元素组合的格式,或其它 CSS 允许的选择器形式的格式(例如,每当 h2 标题出现在表格单元格内时,就应用选择器 td h2)。高级样式还可以重定义包含特定 id 属性的标签的格式(例如,由 #myStyle 定义的样式可以应用到所有包含属性/值对 id="myStyle" 的标签)。

阅读全文

[导读]做网站,麻烦在更新和改版,特别是大规模更新,如果不是用cms系统,手工工作量非常大。   告诉你个秘密吧,其实只要用好模板工具,就能很好地“批发”网页。常见的网页制作工具如DreamWeaver中都有这项功能,使用模板就能减少大量的重复劳动。   一、建立模板   1、创建模板页面   最简单的办法是将一个网页另存为模

 
 
做网站,麻烦在更新和改版,特别是大规模更新,如果不是用cms系统,手工工作量非常大。

  告诉你个秘密吧,其实只要用好模板工具,就能很好地“批发”网页。常见的网页制作工具如DreamWeaver中都有这项功能,使用模板就能减少大量的重复劳动。

  一、建立模板

  1、创建模板页面

  最简单的办法是将一个网页另存为模板文件,通过执行命令:File→Save as Template,DreamWeaver会在网站根目录中建立一个模板文件夹——Templates来保存该模板。

  当然,也可以新建一个模板:Window→Templates,会出现的Templates面板,单击右下角的New Template按钮,输入文件名,就建立了一个空模板;再单击Open Template按钮打开该模板,保存后自动存放于网站模板文件夹Templates中。

  新建、打开的模板页面和普通的网页没什么两样,同样可以加入表格、层、图片、动画、脚本,设置页面属性等。

  举例:这里以制作一个模板为例来说明。在该页面中,我们希望左侧的网站标识图和底部的导航图出现在每个页面中。其中标识图由两幅图片叠加而成,导航图上的文字“最近更新”、“在线阅读”、“打包下载”等划分成几个热区分别链接到不同的文件,它们在每个页面中都不变。右上部的主页面区和左下角弹出式选单按钮下面的页面说明则各不相同。为了保持页面整洁,我们用表格来布置这些元素。

  准确地说它只是一个没有可编辑区域的“准模板”,下面再设定可编辑区域。

  2、设定可编辑区域

  设定模板可编辑区域,一般来说有两种方法。

  新建可编辑区域:选择命令:Modify→Template→New Editable Region。在某一空白区域中单击后执行该命令即可将该区域变为可编辑区域。

  标记某一区域为可编辑区域:选择命令:Modify→Template→Mark Selectin as Editable Region。如果某区域已经有一些文字,并且希望在以后新建的超文本文件中部分保留其内容,先选中该区域再执行标记命令即可。

  取消可编辑状态:选择命令:Modify→Template→Unmark Editable Region。执行该命令后会弹出一个对话框,其中有当前已有的可编辑区域列表,选中要取消的区域名称,确认即可。

  举例:在大片空白区中随便单击一下,执行Modify→Template→New Editable Region命令,在弹出对话框中输入名称:Main;选中左下角本页说明下面的文字,执行Modify→Template→Mark Selectin as Editable Region命令,输入名称:exp。可以看到可编辑区显示为浅蓝色,保存即完成模板制作。

  二、使用模板批量制作网页

  1、根据模板新建页面


  命令:File→New From Template。弹出对话框,从模板列表中选取模板,出现的新页面中除可编辑区外均有淡黄色背景,是不能进行修改的部分。空白的Main编辑区可直接进行插入表格、文字、图片等操作,Exp编辑区保留有原来的文字,修改或重新编辑均可。

  2、对一个已经有内容的页面应用模板

  命令:Modify→Template→Apply Template to Page。选择模板后还会弹出一个对话框,让您选择现有的孤立内容保存到哪个可编辑区域(Choose Editable Region for Orphaned Content)。要是不想保留则可以选择“(none)”。

  举例:我们先新建一个普通页面,输入:“CIW电脑工作室”,执行Modify→Template→Apply Template to Page命令,选择模板test,现有内容保存区域选择Main,确认后可看到页面自动变成了模板页的形式,而“CIW电脑工作室”这一行字就出现在主编辑窗口中。

  3、更新模板以全面更新站点

  基于某一模板建立了一些页面后,对模板进行修改后保存时,就会自动弹出一个对话框,列出所有使用了该模板的页面,询问是否要更新。

  另外一种方法是执行Modify→Template→Update Pages命令。从Update Pages对话框中选择一个站点或站点的某一种模板(同一站点中可以使用多个模板),单击右侧的Start按钮,软件会自动搜索与模板相关联的网页并进行更新。非常方便!

  举例:Test模板左侧图形中的“读书破万站”图片是用一个图层叠加在另一幅图片之上的,现在不想要它,同时还想将所有页面中的该图片均删除。就可以打开模板test.dwt,删除该图层,保存模板,单击右侧的“Update”按钮即可。

  注意:新建和使用模板前需定义站点。方法是,执行命令:Site→Define Sites;指定站点名称和本地根目录(Local Root)。模板使用的是相对路径,如果没有指定网站在本地的位置,软件就不能准确找到并保存模板文件;并且应用模板新建和更新页面时,页面中的超链接也不能随页面文件保存位置的不同而相应变化。
阅读全文

[导读]做网站,麻烦在更新和改版,特别是大规模更新,如果不是用cms系统,手工工作量非常大。   告诉你个秘密吧,其实只要用好模板工具,就能很好地“批发”网页。常见的网页制作工具如DreamWeaver中都有这项功能,使用模板就能减少大量的重复劳动。  一、建立模板  1、创建模板页面  最简单的办法是将一个网页另存为模板

 
 
 
 
  做网站,麻烦在更新和改版,特别是大规模更新,如果不是用cms系统,手工工作量非常大。

 

  告诉你个秘密吧,其实只要用好模板工具,就能很好地“批发”网页。常见的网页制作工具如DreamWeaver中都有这项功能,使用模板就能减少大量的重复劳动。

  一、建立模板

  1、创建模板页面

  最简单的办法是将一个网页另存为模板文件,通过执行命令:File→Save as Template,DreamWeaver会在网站根目录中建立一个模板文件夹——Templates来保存该模板。

  当然,也可以新建一个模板:Window→Templates,会出现的Templates面板,单击右下角的New Template按钮,输入文件名,就建立了一个空模板;再单击Open Template按钮打开该模板,保存后自动存放于网站模板文件夹Templates中。

  新建、打开的模板页面和普通的网页没什么两样,同样可以加入表格、层、图片、动画、脚本,设置页面属性等。

  举例:这里以制作一个模板为例来说明。在该页面中,我们希望左侧的网站标识图和底部的导航图出现在每个页面中。其中标识图由两幅图片叠加而成,导航图上的文字“最近更新”、“在线阅读”、“打包下载”等划分成几个热区分别链接到不同的文件,它们在每个页面中都不变。右上部的主页面区和左下角弹出式选单按钮下面的页面说明则各不相同。为了保持页面整洁,我们用表格来布置这些元素。

  准确地说它只是一个没有可编辑区域的“准模板”,下面再设定可编辑区域。

  2、设定可编辑区域

  设定模板可编辑区域,一般来说有两种方法。

  新建可编辑区域:选择命令:Modify→Template→New Editable Region。在某一空白区域中单击后执行该命令即可将该区域变为可编辑区域。

  标记某一区域为可编辑区域:选择命令:Modify→Template→Mark Selectin as Editable Region。如果某区域已经有一些文字,并且希望在以后新建的超文本文件中部分保留其内容,先选中该区域再执行标记命令即可。

  取消可编辑状态:选择命令:Modify→Template→Unmark Editable Region。执行该命令后会弹出一个对话框,其中有当前已有的可编辑区域列表,选中要取消的区域名称,确认即可。

  举例:在大片空白区中随便单击一下,执行Modify→Template→New Editable Region命令,在弹出对话框中输入名称:Main;选中左下角本页说明下面的文字,执行Modify→Template→Mark Selectin as Editable Region命令,输入名称:exp。可以看到可编辑区显示为浅蓝色,保存即完成模板制作。
二、使用模板批量制作网页

  1、根据模板新建页面

  命令:File→New From Template。弹出对话框,从模板列表中选取模板,出现的新页面中除可编辑区外均有淡黄色背景,是不能进行修改的部分。空白的Main编辑区可直接进行插入表格、文字、图片等操作,Exp编辑区保留有原来的文字,修改或重新编辑均可。

  2、对一个已经有内容的页面应用模板

  命令:Modify→Template→Apply Template to Page。选择模板后还会弹出一个对话框,让您选择现有的孤立内容保存到哪个可编辑区域(Choose Editable Region for Orphaned Content)。要是不想保留则可以选择“(none)”。

  举例:我们先新建一个普通页面,输入:“CIW电脑工作室”,执行Modify→Template→Apply Template to Page命令,选择模板test,现有内容保存区域选择Main,确认后可看到页面自动变成了模板页的形式,而“CIW电脑工作室”这一行字就出现在主编辑窗口中。

  3、更新模板以全面更新站点

  基于某一模板建立了一些页面后,对模板进行修改后保存时,就会自动弹出一个对话框,列出所有使用了该模板的页面,询问是否要更新。

  另外一种方法是执行Modify→Template→Update Pages命令。从Update Pages对话框中选择一个站点或站点的某一种模板(同一站点中可以使用多个模板),单击右侧的Start按钮,软件会自动搜索与模板相关联的网页并进行更新。非常方便!

  举例:Test模板左侧图形中的“读书破万站”图片是用一个图层叠加在另一幅图片之上的,现在不想要它,同时还想将所有页面中的该图片均删除。就可以打开模板test.dwt,删除该图层,保存模板,单击右侧的“Update”按钮即可。

  注意:新建和使用模板前需定义站点。方法是,执行命令:Site→Define Sites;指定站点名称和本地根目录(Local Root)。模板使用的是相对路径,如果没有指定网站在本地的位置,软件就不能准确找到并保存模板文件;并且应用模板新建和更新页面时,页面中的超链接也不能随页面文件保存位置的不同而相应变化。

阅读全文

[导读]滚动字幕会让很多人感到兴奋,特别是第一次使用滚动字幕时,会爱不释手。现在做一个详细的方案,让你更全面地了解一下。

 
 

  滚动字幕会让很多人感到兴奋,特别是第一次使用滚动字幕时,会爱不释手。现在做一个详细的方案,让你更全面地了解一下。

  滚动字幕在FrontPage的组件里有,但是FrontPage这个软件只能支持单行文字,一出现多行文字它就无能为力了,而且它只能支持一行滚动!(如果出现只能滚动一行的情况,解决办法是把这段代码嵌入到JavaScript的document.write里面,请看下面例的详细说明)Dreamweaver也只能用编写HTML代码的方法。所以强烈建议用记事本打开网页源代码来编辑。

  1.建立第一个滚动字幕。代码:
  

以下是引用片段:
<marquee scrollAmount=2 width=300>滚动字幕</marquee> 

  2.各参数详解:

  a)scrollAmount。它表示速度,值越大速度越快。如果没有它,默认为6,建议设为1~3比较好。

  b)width和height,表示滚动区域的大小,width是宽度,height是高度。特别是在做垂直滚动的时候,一定要设height的值。

  c)direction。表示滚动的方向,默认为从右向左:←←←。可选的值有right、down、up。滚动方向分别为:right表示→→→,up表示↑,down表示↓。

  d)scrollDelay,这也是用来控制速度的,默认为90,值越大,速度越慢。通常scrollDelay是不需要设置的。

  e)behavior。用它来控制属性,默认为循环滚动,可选的值有alternate(交替滚动)、slide(幻灯片效果,指的是滚动一次,然后停止滚动)

  3.实例:

  a)如何给滚动字幕加超链接?这跟平时的超链接是完全一样的。只要在文字外面加上

以下是引用片段:
<marquee scrollAmount=2 width=300><a href=http://www.cctv.com>中央电视台</a></marquee>


          
点击中央电视台就可以进入了:

        中央电视台

  b)如何制作当鼠标停留在文字上,文字停止滚动?

  代码如:

以下是引用片段:
<marquee scrollAmount=2 width=300 onmouseover=stop() onmouseout=start()>文字内容</marquee>

  c)交替效果。代码如:
   

以下是引用片段:
<marquee scrollAmount=2 width=99 behavior=alternate>文字内容</marquee>

  d)多行文本向上滚动。代码如:

以下是引用片段:
<marquee scrollAmount=2 width=300 height=160 direction=up>·早晨好啊!<br>·空气好清新啊<br>·今朝食乜好呢?<p>·<a href=http://www.cctv.com>中央电视台</a></marquee>  

  ·注意:如果你的网页经过了FrontPage编辑,保存之后,只能滚动一行,这时候你发现你原来的代码顺序已经变了,My god!解决的办法是,找出原来的代码,把它嵌入到JavaScript的document.write中即可,上述代码写为:

以下是引用片段:
<marquee scrollAmount=2 width=300 height=160 direction=up>·早晨好啊!<br>·空气好清新啊<br>·今朝食乜好呢?<p>·<a href=http://www.cctv.com>中央电视台</a></marquee> 

阅读全文

--HTML文档中小meta标签的大作用
meta是用来在HTML文档中模拟HTTP协议的响应头报文。meta标签用于网页的<head>与</head>中,meta标签的用处很多。meta的属性有两种:name和http-equiv。name属性主要用于描述网页,对应于content(网页内容),以便于搜索引擎机器人查找、分类(目前几乎所有的搜索引擎都使用
网上机器人自动查找meta值来给网页分类)。这其中最重要的是description(站点在搜索引擎上的描述)和keywords(分类关键词),所以应该给每页加一个meta值。比较常用的有以下几个:
name属性
 

1、<metaname="Generator"contect="">用以说明生成工具(如MicrosoftFrontPage4.0)等;

2、<metaname="KEYWords"contect="">向搜索引擎说明你的网页的关键词;

3、<metaname="DEscription"contect="">告诉搜索引擎你的站点的主要内容;

4、<metaname="Author"contect="你的姓名">告诉搜索引擎你的站点的制作的作者;

5、<metaname="Robots"contect=

"all|none|index|noindex|follow|nofollow">

其中的属性说明如下:

设定为all:文件将被检索,且页面上的链接可以被查询;

设定为none:文件将不被检索,且页面上的链接不可以被查询;

设定为index:文件将被检索;

设定为follow:页面上的链接可以被查询;

设定为noindex:文件将不被检索,但页面上的链接可以被查询;

设定为nofollow:文件将不被检索,页面上的链接可以被查询。

http-equiv属性

1、<metahttp-equiv="Content-Type"contect="text/html";charset=gb_2312-80">

和<metahttp-equiv="Content-Language"contect="zh-CN">用以说明主页制作所使用的文字以及语言;

又如英文是ISO-8859-1字符集,还有BIG5、utf-8、shift-Jis、Euc、Koi8-2等字符集;

2、<metahttp-equiv="Refresh"contect="n;url=http://yourlink">定时让网页在指定的时间n内,跳转到页面http;//yourlink;

3、<metahttp-equiv="Expires"contect="Mon,12May200100:20:00GMT">可以用于设定网页的到期时间,一旦过期则必须到服务器上重新调用。需要注意的是必须使用GMT时间格式;

4、<metahttp-equiv="Pragma"contect="no-cache">是用于设定禁止浏览器从本地机的缓存中调阅页面内容,设定后一旦离开网页就无法从Cache中再调出;

5、<metahttp-equiv="set-cookie"contect="Mon,12May200100:20:00GMT">cookie设定,如果网页过期,存盘的cookie将被删除。需要注意的也是必须使用GMT时间格式;

6、<metahttp-equiv="Pics-label"contect="">网页等级评定,在IE的internet选项中有一项内容设置,可以防止浏览一些受限制的网站,而网站的限制级别就是通过meta属性来设置的;

7、<metahttp-equiv="windows-Target"contect="_top">强制页面在当前窗口中以独立页面显示,可以防止自己的网页被别人当作一个frame页调用;

8、<metahttp-equiv="Page-Enter"contect="revealTrans(duration=10,transtion=

50)">和<metahttp-equiv="Page-Exit"

contect="revealTrans(duration=20,transtion

=6)">设定进入和离开页面时的特殊效果,这个功能即FrontPage中的“格式/网页过渡”,不过所加的页面不能够是一个frame页面。

阅读全文

今天,使用各种所见即所得工具制作主页已经是一件非常容易的事情了。但是了解HTML源代码和语法,无疑对我们制作主页有更大的帮助,也可以使用户能更精确地控制页面的效果。介绍HTML语法的文章已经很多,但是除了TITLE标记外,HEAD里还有其他的几个标记。这些标记虽然不常用,但是需要我们对他们有一定的了解。

  一、META

  META标记用于描述不包含在标准HTML里的一些文档信息。激烈的竞争使浏览器厂商纷纷利用META开发出许多实用的功能,又使这些功能在常用的浏览器中都有效。下面介绍几个很有用的用法:

  *<META NAME="keywords" CONTENT="yourkeyword">
  <META NAME="description" CONTENT="your homepage's description">
  本页的关键字和描述。在页面里加上这些定义后,一些搜索引擎就能够让读者根据这些关键字查找到你的主页,了解你的主页内容。

  * <META HTTP-EQUIV="refresh" CONTENT="60; URL="new.htm">
  浏览器将在60秒后,自动转向到new.htm。你可以利用这个功能,制作一个封面,在若干时间后,自动带读者来到你的目录页。
  如果URL项没有,浏览器就是刷新本页。这就实现了WWW聊天室定期刷新的特性。

  * <META HTTP-EQUIV="content-type" CONTENT="text/html; charset=GB2312">
  描述本页使用的语言。浏览器根据此项,就可以选择正确的语言编码,而不需要读者自己在浏览器里选择。GB2312是指简体中文,而台湾BIG5内码的主页则是用BIG5。

   * <META HTTP-EQUIV="Pragma" CONTENT="no-cache">
  强制性调用网上的最新版本。浏览器为了节约时间,在本地硬盘上保存一个网上文件的临时版本。在你要重新调用时,直接显示硬盘上的文件,而不是网上的。如果你想让读者每次都看到最新的版本,就加上这句话。

  二、LINK

  显示本文档和其他文档之间的连接关系。一个最有用的应用就是外部层叠样式表的定位。格式如下:

  <LINK REL="stylesheet" HREF="style.css">

  REL参数说明两个文档之间的关系,HREF说明目标文档名。

  关于层叠样式表,请参考其他文章。

  三、BASE

  BASE主要有两种用处:

  1、<BASE HREF="原始地址">
  本文档的原始地址。这样,读者下载你的文档之后,也可以知道是从哪里下载的。

  2、<BASE TARGET="目的框架名">
  在一个框架(frame)页中,如果要把某个框架的连接在另外一个框架显示,例如,把menu框架中的连接显示到content框架,就可以在menu框架中的页面加上<BASE TARGET="content">,这样,就没有必要在menu页面的所有连接的<a>标记中添加target属性了,除非这个连接不是在content框架中显示。

四、BODY

  BODY标记有一些属性,用于定义页面内的显示效果。
  ALINK、LINK、TEXT、VLINK

  文字的颜色。

  ALINK:当前激活的连接的文字颜色。
  LINK:连接的文字颜色。
  TEXT:文字的颜色。
  VLINK:参观过的文字颜色。

  注意:文字的颜色要和背景色有明显的差别,以便读者浏览。

  BACKGROUND、BGPROPERTIES、BGCOLOR:页面的背景部分。

  BACKGROUND:背景图案,该图案在页面内平铺。背景图案应保持单一色调,以保证页面文字易于阅读。
  BGPROPERTIES:设置成FIXED,则背景图案不滚动。(只对INTERNET EXPLORER有效)
  BGCOLOR:背景色。

  注意:如果你的背景图案是深色调,因之文字颜色为淡颜色,那么由于浏览器调用页面的顺序是“背景色-文字-背景图案”,那么在背景图案没有显示的情况下,你的文字在白颜色下很难阅读,所以应该选用一个跟你的背景图案颜色一致的背景色。

  LEFTMARGIN、TOPMARGIN:页边空白。(只对INTERNET EXPLORER有效)

  LEFTMARGIN:左边页边空白。
  TOPMARGIN:顶端页边空白。
  MARGINWIDTH、MARGINHEIGHT:页边空白。(只对NETSCAPE NAVIGATOR有效)
  MARGINWIDTH:左右页边空白宽度
  MARGINHEIGHT:上下页边空白高度

  在这里,我们第一次碰到了INTERNET EXPLORER和NETSCAPE NAVIGATOR支持不同的标记的情况。由于商业竞争的残酷,作为两家最大的浏览器软件开发商,MICROSOFT和NETSCAPE都在扩展HTML的功能,增加一些标准HTML没有的标记。由于互相保守商业机密,两家发展的标记不尽相同。值得庆幸的是,这两种浏览器对于自己无法辨认的标记,不会报错,只是简单的忽略过去。这样,我们把它们各自支持的标记都加上,就可以达到一致的效果。就这个例子来说,如果我们想制作一个页面,使用两种浏览器来看,页边空白都是0,就可以这样写:

   <BODY LEFTMARGIN="0" TOPMARGIN="0" MARGINWIDTH="0" MARGINHEIGHT="0">

  其他类似的情况也一样,只要我们把它们都写在一起一般就没有问题了。

阅读全文

■ 调色原理:

  HTML 的颜色表示可分两种:

以命名方式定义常用的颜色,如 RED。
以 RGB 值表示,如 #FF0000 表示 red。
  命名方式所包括的色种不多也不是很方便,所以较少采用,以下介绍 RGB 值的原理:

  众所周知颜色是由 "red" "green" "blue" 三原色组合而成的,在 HTML 中对于彩度的定义是采用十六进制的,对于三原色 HTML 分别给予两个十六进位去定义,也就是每个原色有 256 种彩度,故此三原色可混合成一千六百多万个颜色。

  例如

  白色的组成是 red=ff, green=ff, blue=ff, RGB 值即为 ffffff
  红色的组成是 red=ff, green=00, blue=00, RGB 值即为 ff0000
  绿色的组成是 red=00, green=ff, blue=00, RGB 值即为 00ff00
  蓝色的组成是 red=00, green=00, blue=ff, RGB 值即为 0000ff
  黑色的组成是 red=00, green=00, blue=00, RGB 值即为 000000

  应用的时候通常在 RGB 值前加上符号 # 以示分别,但不加也可。

 

■ HTML 基本架构:


按不同颜色按钮以测试前景颜色的效果 (只适合 Internet Explorer)
      
按不同颜色按钮以测试背景颜色的效果
      
或输入一个 RGB 颜色值或名称
  


■ 16 常用颜色表:


Color Value Name  Color Value Name
 #00FFFF aqua   #808080 gray
 #000080 navy   #C0C0C0 silver
 #000000 black   #008000 green
 #808000 olive   #008080 teal
 #0000FF blue   #00FF00 lime
 #800080 purple   #FFFF00 yellow
 #FF00FF fuchsia   #800000 maroon
 #FF0000 red   #FFFFFF white


■ 其它常用颜色:


Color Value Name  Color Value Name
 #F0F8FF aliceblue   #A00000 antiquewith
 #7FFFD4 aquamarine   #F0FFFF azure
 #F5F5DC beige   #FFE4C4 bisque
 #000000 black   #FFEBCD blanchedalmond
 #0000FF blue   #8A2BE2 blueviolet
 #A52A2A brown   #DEB887 burlywood
 #5F9EA0 cadetblue   #7FFF00 chartreuse
 #D2691E chocolate   #FF7F50 coral
 #C0F000 cornfloewrblue   #FFF8DC cornsilk
 #00FFFF cyan   #00008B darkblue
 #008B8B darkcyan   #B8860B darkgoldenrod
 #A9A9A9 darkgray   #006400 darkgreen
 #DA0000 darkhaki   #8B008B darkmagenta
 #556B2F darkolivegreen   #DA000E darkorenge
 #9932CC darkorchid   #8B0000 darkred
 #E9967A darksalmon   #8FBC8F darkseagreen
 #483D8B darkslateblue   #2F4F4F darkslategray
 #00CED1 darkturquoise   #9400D3 darkviolet
 #FF1493 deeppink   #00BFFF deepskyblue
 #696969 dimgray   #1E90FF dodgerblue
 #B22222 firebrick   #FFFAF0 floralwhite
 #228B22 forestgreen   #DCDCDC gainsboro
 #00000E gostwhite   #FFD700 gold
 #00E00D golenrod   #808080 gray
 #008000 green   #ADFF2F greenyellow
 #F0FFF0 honeydew   #FF69B4 hotpink
 #CD5C5C indianred   #FFFFF0 ivory
 #F0E68C khaki   #E6E6FA lavender
 #FFF0F5 lavenderblush   #7CFC00 lawngreen
 #FFFACD lemonchiffon   #ADD8E6 lightblue
 #F08080 lightcoral   #E0FFFF lightcyan
 #0000E0 lightgodenrod   #0000E0 lightgodenrodyellow
 #0000A0 lightgray   #90EE90 lightgreen
 #FFB6C1 lightpink   #FFA07A lightsalmon
 #20B2AA lightseagreen   #87CEFA lightskyblue
 #0000EB lightslateblue   #778899 lightslategray
 #B0C4DE lightsteelblue   #FFFFE0 lightyellow
 #32CD32 limegreen   #FAF0E6 linen
 #FF00FF magenta   #800000 maroon
 #66CDAA mediumaquamarine   #0000CD mediumblue
 #BA55D3 mediumorchid   #ED0000 mediumpurpul
 #3CB371 mediumseagreen   #7B68EE mediumslateblue
 #00FA9A mediumspringgreen   #48D1CC mediumturquoise
 #C71585 mediumvioletred   #191970 midnightblue
 #F5FFFA mintcream   #FFE4E1 mistyrose
 #FFE4B5 moccasin   #FFDEAD navajowhite
 #000080 navy   #A0B0E0 navyblue
 #FDF5E6 oldlace   #6B8E23 olivedrab
 #FFA500 orange   #0E0EED orengered
 #DA70D6 orchid   #A00D00 palegodenrod
 #98FB98 palegreen   #AFEEEE paleturquoise
 #DB7093 palevioletred   #FFEFD5 papayawhip
 #FFDAB9 peachpuff   #CD853F peru
 #FFC0CB pink   #DDA0DD plum
 #B0E0E6 powderblue   #800080 purple
 #FF0000 red   #BC8F8F rosybrown
 #4169E1 royalblue   #8B4513 saddlebrown
 #FA8072 salmon   #F4A460 sandybrown
 #2E8B57 seagreen   #FFF5EE seashell
 #A0522D sienna   #87CEEB skyblue
 #6A5ACD slateblue   #708090 slategray
 #FFFAFA snow   #00FF7F springgreen
 #4682B4 steelblue   #D2B48C tan
 #D8BFD8 thistle   #FF6347 tomato
 #40E0D0 turquoise   #EE82EE violet
 #00E0ED violetred   #F5DEB3 wheat
 #000E00 hite   #F5F5F5 whitesmoke
 #FFFF00 yellow   #9ACD32 yellowgreen

全文完

阅读全文

■ 多媒体

<BGSOUND>
<EMBED>

  欲明白本篇【HTML彻底剖析】之标记分类,请看 【标记一览】。
  也请先明白围堵标记与空标记的分别,请看 【HTML概念】。

 

■ <BGSOUND>:

  <BGSOUND> 是用来插入背景音乐,但只适用于 IE,其参数设定不多。如下

  <BGSOUND src="your.mid" autostart=true loop=infinite>

src="your.mid"
设定 midi 档案及路径,可以是相对或绝对。
autostart=true
是否在音乐档下载完之后就自动播放。true 是,false 否 (内定值)。
loop=infinite
是否自动反复播放。LOOP=2 表示重复两次,Infinite 表示重复多次。
■ <EMBED>:

  EMBED> 是用来插入各种多媒体,格式可以是 Midi、Wav、AIFF、AU 等等,Netscape 及 新版的 IE 都支持。其参数设定较多。如下下

  <EMBED src="your.mid" autostart="true" loop="true" hidden="true">

src="your.mid"
设定 midi 档案及路径,可以是相对或绝对。
autostart=true
是否在音乐档下载完之后就自动播放。true 是,false 否 (内定值)。
loop="true"
是否自动反复播放。LOOP=2 表示重复两次,true 是, false 否。
HIDDEN="true"
是否完全隐藏控制画面,true 为是,no 为否 (内定)。
STARTTIME="分:秒"
设定歌曲开始播放的时间。如 STARTTIME="00:30" 表示从第30秒处开始播放。
VOLUME="0-100"
设定音量的大小,数值是0到100之间。内定则为使用系统本身的设定。
WIDTH="整数" 和 HIGH="整数"
设定控制面板的高度和宽度。(若 HIDDEN="no")
ALIGN="center"
设定控制面板和旁边文字的对齐方式,其值可以是 top、bottom、center、baseline、 left、right、texttop、middle、absmiddle、absbottom
CONTROLS="smallconsole"
设定控制面板的外观。预设值是 console。
console 一般正常面板   
smallconsole 较小的面板   
playbutton 只显示播放按钮   
pausecutton 只显示暂停按钮   
stopbutton 只显示停止按钮   
volumelever 只显示音量调节按钮

阅读全文

<FRAMESET> <FRAME>
<NOFRAMES>
<IFRAME>

  欲明白本篇【HTML彻底剖析】之标记分类,请看 【标记一览】。
  也请先明白围堵标记与空标记的分别,请看 【HTML概念】。

 

■ 框架概念 :

  谓框架便是网页画面分成几个框窗,同时取得多个 URL。只需要 <FRAMESET> <FRAME> 即可,面所有框架标记需要放在一个总起的 html 档,这个档案只记录了该框架如何分割 ,不会显示任何资料,所以不必放入 <BODY> 标记,浏览这框架必须读取这档案 面不是其他框窗的档案。<FRAMESET> 是用来划分框窗,每一窗框由一个 <FRAME> 标 记所标示,<FRAME>必须在 <FRAMESET> 范围中使用。如下例:

  <frameset cols="50%,*"> <frame name="hello" src="up2u.html"> <frame name="hi" src="me2.html">
  </frameset>

  此例中 <FRAMESET> 把画面分成左右两相等部分,左便是显示 up2u.html,右边则会显示 me2.html 这档案,<FRAME> 标记所标示的框窗永远是按由上而下、由左至右的次序。

■ <FRAMESET> <FRAME> : ▲Top


  以上所述只是最简单的框架设定,若希望达到更合适的效果请加入或修改以下各参数。

  标记:<FRAMESET>
  例子:<frameset rows="90,*" frameborder="0" border=0 framespacing="2" border="2" bordercolor="#008000"></frameset>
  功用:宣告HTML文件为框架模式,并设定视窗如何分割。

  参数:

COLS="90,*"
垂直切割画面(如分左右两个画面),接受整数值、百分数, * 则代表占用剩余的空间。数值的个数代表分成的视窗数目且以逗号分隔。例如 COLS="30,*,50%" 可以切成三个视窗,第一个视窗是 30 pixels 的宽度,为一绝对分割,第二个视窗是当分配完第一及第三个视窗后剩下的空间,第三个视窗则占整个视窗画面的 50% 宽度为一相对分割。你可自己调整数字。

ROWS="120,*"
这是横向切割,将画面上下分开,数值设定同上。 COLS 与 ROWS 两参数尽量不要放在同一个 <FRAMESET> 标记中,因 Netacape 偶然不能显示这类型的框架,尽量采用多重分割,如以上各例。

frameborder="0"
设定框架的边框,其值只有 0 和 1 , 0 表示不要边框, 1 表示要显示边框。

border="0"
设定框架的边框厚度,以 pixels 为单位。

bordercolor="#008000"
设定框架的边框颜色。颜色值请参考【调色原理】。

framespacing="5"
表示框架与框架间保留的空白的距离。
  标记:<FRAME>
  例子:<frame name="top" src="a.html" marginwidth="5" marginheight="5" scrolling="Auto" frameborder="0" noresize framespacing="6" bordercolor="#0000FF">
  功能:设定每一个框窗内的参数属性。
  参数:


SRC="a.html"
设定此框窗中要显示的网页档案名称,每个框窗一定要对应一个网页档案。

NAME="top"
设定这个框窗的名称,这样才能指定框架来作链接,必须但任意命名。

frameborder=0
设定框架的边框,其值只有 0 和 1 , 0 表示不要边框, 1 表示要边框。

framespacing="6"
表示框架与框架间的保留的空白的距离。

bordercolor="#008000"
设定框架的边框颜色。

scrolling="Auto"
设定是否要显示卷轴,YES 表示要显示卷轴,NO 表示无论如何都不要显示卷轴,AUTO 视情况而定。

noresize
设定不让使用者可以改变这个框框的大小,如没有设定此参数,使用者可随意地拉动框架改变其大小。

marginhight=5
表示框架高度部分边缘所保留的空间。

marginwidth=5
表示框架宽度部分边缘所保留的空间。
  以下是一些例子:
例子 HTML Code
 
 
 <frameset rows="80,*">
<frame name="top" src="a.html">
<frame name="bottom" src="b.html">
</frameset> 
例子 HTML Code
 
 
 
 <frameset rows="80,*,80">
<frame name="top" src="a.html">
<frame name="middle" src="b.html">
<frame name="bottom" src="c.html">
</frameset> 
例子 HTML Code
 
 
 <frameset cols="150,*">
<frameset rows="80,*">
<frame name="upper_left" src="a.html">
<frame name="lower_left" src="b.html">
</frameset>
<frame name="right" src="c.html">
</frameset> 
例子 HTML Code
 
 
 <frameset rows="80,*">
<frame name="top" src="a.html">
<frameset cols="150,*">
<frame name="lower_left" src="b.html">
<frame name="lower_right" src="c.html">
</frameset>
</frameset> 
例子 HTML Code
 
 
 <frameset cols="150,*">
<frame name="left" src="a.html">
<frameset rows="80,*">
<frame name="upper_right" src="b.html">
<frame name="lower_right" src="c.html">
</frameset>
</frameset> 

■ <NOFRAMES> : ▲Top


  当别人使用的浏览器太旧,不支持框架功能时,他看到的将是一片空白。为了避免这种情况,可使用 <NOFRAMES> 这个标记,当使用者的浏览器看不到框架时,他就会看到 <NOFRAMES> 与 </NOFRAMES> 之间的内容,而不是一片空白。这些内容可以是提醒浏览者采用新的浏览器的字句,也可以是一个没有框架的网页或切换到没有框架的版本的链接都可。

  应用方法:
  在<frameset> 标记范围加入 </NOFRAMES> 标记,以下是例子:

<frameset rows="80,*">
<noframes>
<body>
很抱谦,您使用的浏览器不支持框架功能,请采用新版本的浏览器。
</body>
</noframes>
<frame name="top" src="a.html">
<frame name="bottom" src="b.html">
</frameset>
  若浏览器支持框架,那么它不会理会 <noframes> 中的内容,但若浏览器不支持框架,由于不认识所有框架标记,不明的标记被略过,标记包围的内容便被解读出来,所以在 <noframes>范围内的文字被显示。

■ <IFRAME> : ▲Top


  这标记只适用于 IE。 它的作用是在一页中间插入一个框窗以显示另一个文件。它是一个围堵标记,但围堵着的字句只有在浏览器不支持 iframe 标记时才显示,如<noframes> 一样,可以放一些提醒的字句之类。通常 iframe 配合一个辩认浏览器的的 Java Script 会更好,若于 JavaScript 认出该浏览器并非 Internet Explorer 便会切换到另一个版本。

  <iframe> 的参数如下:
  例子: <iframe src="iframe.html" name="test" align="MIDDLE" width="300" height="100" marginwidth="1" marginheight="1" frameborder="1" scrolling="Yes">

src="iframe.html"
欲显示于此框窗的文件来源除档案名称,必要加上相对或绝对路径。
name="test"
此框窗名称,这是链接标记的 target 参数所需要的,
align="MIDDLE"
可选值为 left, right, top, middle, bottom,作用不大
width="300" height="100"
框窗的宽及长,以 pixels 为单位。
marginwidth="1" marginheight="1"
该插入的文件与框边所保留的空间。
frameborder="1"
使用 1 表示显示边框, 0 则不显示。(可以是 yes 或 no)
scrolling="Yes"
使用 Yes 表示允许卷动(内定), No 则不许。
例子: 原代码
<center> <iframe src="iframe.html" name="test" align="MIDDLE" width="300" height="100" marginwidth="5" marginheight="5" frameborder="1">
很抱谦,您的浏览器并不支持 IFrame,不能正常浏览我的网页。</iframe>
</center> 
显示结果
 

阅读全文

■ 链接标记

<A>
<BASE>

  欲明白本篇【HTML彻底剖析】之标记分类,请看 【标记一览】。
  也请先明白围堵标记与空标记的分别,请看 【HTML概念】。

■ <A> : ▲Top


  <A> 称链接标记,由 <A> 与 </A> 所围的文字、图片等等可以成为一个链接。

  <A> 的一般参数设定:

  例如 <a href="index.html" name="hello" target="_top">

href="index.html"
这参数不能与另一参数 name 同时使用,使用这参数才能制作可按的链接。


当作为一外部链接时: href 所设定的是该链接所要链到的文件名称,若该文件与此 html 档不是同在一目录请加上适当的路径,相对绝对皆可。


当作为一内部链接时: href 所设定的是该链接所要连到的同文件内参考点或指定文件的参考点,且不需要包括任何内容只要加上结束标记 </a>便可以,例如 <a href="#there"></a> 、 <a href="index.html
#there"></a> 及 <a href="http://www.school.net.hk/~chris55
/index.html#there"></a> 其中 there 便是参考点,并需于其前加上符号 # 以作识别,参考点由下一个参数 name 事先于文件中埋下。

 

name="hello"
这参数是为文件埋下参考点,作为被链结,不会被显示。所以说制作一个风部链接需要使用两次 <A> 链接标记。一个使用参数 name 事先于文件中埋下一参考点,另一个使用参数 href 链接到这个参考点。

target="_top"
设定链接被按了之后所要显示的视窗。可选值为: _blank, _parent, _self, _top, 框架名称。

target="框架名称"
这只运用于框架网页中,若设定则链接结果将显示在"框架名称"的框窗中,框窗名称是事先由框架标记命名。
target="_blank" 或 target="new"
将链接的内容打开在新的浏览器窗口中。
target="_parent"
将链接的内容当成文件的上一个画面。
target="_self"
将链接的内容显示在当前窗口中。(默认值)
target="_top"
将框架中链接的画面内容,显示在没有框架的视窗中。(即除去了框架)
例子一:(外部链接) 原代码 <a href="http://www.fortuneage.com">时代财富公司</a>
<p><a href="http://www.goEway.com">
<img src="link_image.gif" width=99 height=44 border=1 alt="goEway"></a>
<p><a href="http://www.goEway.com">
<img src="link_image.gif" width=99 height=44 border=0 alt="goEway"></a> 
显示结果 时代财富公司
 

 
 


例子二(内部链接):请到 PenPal Garden 的 FAQ Page 去体验一下何为内部链接。 原代码 <a name="test"></a>
<a href="#test">本页的内部链接</a>
<br><a href="http://www.school.net.hk/~chi/faq.html#14">跳到 PenPal Garden 的 FAQ 部分</a> 
显示结果 本页的内部链接
跳到 PenPal Garden 的 FAQ 部分 

■ <BASE> : ▲Top


  <BASE> 是一个链接基准标记,用以改变文件中所有链接标记的参数默认值。它只能适应于文件的开头部分,即标记 <HEAD> 与 </HEAD> 之间。

  <BASE> 的一般参数设定:

  例如 <base href="http://www.microsoft.com/" target="_top">

href="http://www.microsoft.com/"
设定该网页中所有 HTTP 文件及图片(包括相对路径链接及 <IMG> 图形标记 等)的默认路径,其他如 ftp:// 及 gopher:// 等则不受影响。这参数只可填入一个相对或绝对路径,不必填入档案名称。一般相对路径链接 及 <IMG> 图形标记等是默认以该网页所在的目录作为起点,若依这个例子,该文件中所有链接将会以 http://www.microsoft.com/ 作为起点,若其中有链接如 <a href="index.html">Back to Main Page</a> ,那么它不会链接到自己目录的 index.html,它将会链接到 Microsoft 的首页,这是因为相对路径已给 <BASE> 转成绝对的了。


target="_top"
设定该网页中所有链接被按之后结果所要显示的视窗,免得分别为所有链接加上 target 参数,常应用于框架中。其设定与 <A> 链接中 target 参数相同。
  例子等以后再写,你可到一些以框架制作的网页上去体检一下。

阅读全文

 

■ 其他标记

<MARQUEE>
<BLINK>
<ISINDEX>
<META>
<LINK>

  欲明白本篇【HTML彻底剖析】之标记分类,请看 【标记一览】。
  也请先明白围堵标记与空标记的分别,请看 【HTML概念】。


■ <MARQUEE>:
  <MARQUEE> 只适用于 IE ,叫做"跑马灯" 如 Status Bar 的那种,意指走动或卷动的文字,其参数设定比较多。我先举些例子,然后再列出各参数。

例子一: 原代码 <marquee width=150>I'm a small MARQUEE</marquee> 
显示结果 I'm a small MARQUEE


例子二: 原代码 <marquee behavior=slide>This is a slide effect</marquee> 
显示结果 This is a slide effect


例子三: 原代码 <marquee behavior=alternate>撞来撞去,啊!我晕啦</marquee> 
显示结果 撞来撞去,啊!我晕啦


例子四: 原代码 <marquee scrolldelay=5 scrollamount=50>哇!!太快了,我又晕了啦!</marquee> 
显示结果 哇!!太快了,我又晕了啦!


<marquee behavior="SCROLL" direction="LEFT" bgcolor="#0000FF" height="30" width="150" hspace="0" vspace="0" loop="INFINITE" scrollamount="30" scrolldelay="500">Hello</marquee>

behavior="SCROLL"
决定文字的卷动方式,可选值为:
SCROLL 一般卷动,是内定值。
SLIDE 如幻灯片,一格格的,文字一接触左边便全消失。
ALTERNATE 文字向左右两边撞来撞去。

direction="LEFT"
设定文字設定文字的卷动方向,LEFT 表示向左,是内定值,RIGHT 表示向右。

bgcolor="#0000FF"
设定文字卷动范围的背景颜色,颜色值可参考【调色原理】。

height="30" width="150"
>设定文字卷动范围,可采用相对或绝对,如 30% 或 30 等,单位为像素。

hspace="0" vspace="0"
设定文字的水平及垂直空白位置。

loop="INFINITE"
设定文字卷动次数,其值可以是正整数或 INFINITE,INFINITE 是默认值,表示无限次。

scrollamount="30"
每「格」文字间的间隔,单位是像素。

scrolldelay="500"
文字卷动的停顿时间,单位是毫秒。
■ <BLINK> : ▲Top

  <BLINK> 是令文字闪烁,只适用于 NC,用法直接,没有参数。看看例子便知:
例子: 原代码 <blink>我是天上星,闪又闪</blink> 
显示结果 我是天上星,闪又闪 

■ <ISINDEX> : ▲Top


  <ISINDEX> 可让某些 Web Server 搜索网页内的关键字,假如你的 Web Server 提供这样的 搜索功能,使用者的浏览器也支持这些功能,那么,载入网页时就会看到一个简单的 搜索框。其用法直接,没有参数,本来是要放于 <HEAD> 标记内的,但把它放在 <BODY> 标记内也不会有问题,请记住,3W 以RED反对此标记。

例子: 原代码 <isindex> 
显示结果
--------------------------------------------------------------------------------
可以搜索该索引。请键入要搜索的关键字:
--------------------------------------------------------------------------------
 

■ <META> : ▲Top


  <META> 是放于 <HEAD> 与 </HEAD>之间的标记,功用与变化等对,所以我公式化地介绍。

<meta name="Description" content="This is Chris's Home Page">
该网页的描述,作用于搜索引擎的登录。

<meta name="Keywords" content="Chris, Web, Music, photo">
该网页的关键字,作用于搜索引擎的登录。

<meta http-equiv="Expires" content="Tue, 09 Dec 1997 00:00:00 GMT">
<meta http-equiv="Pragma" content="no-cache">
以上行功能相同,都是要浏览器重新载入该页,不要使用快取功能,当然可以修改 Expire (过期)时间。

<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
设定这是 HTML 文件及其编码语系,简体中文网页使用charset=gb2312,繁体中文使用charset=big5,或者不设编码也可,纯英文网页建议使用 iso-8859-1。

<meta name="GENERATOR" content="Mozilla/4.04 [en] (Win95; I) [Netscape]">
<meta name="GENERATOR" content="Microsoft FrontPage 3.0">
这只表示该网页由什么编辑器写的。

<meta http-equiv="refresh" content="10; url=http://www.hkiwc.com">
这行较为实用,能于预定秒数内自动转到指定网址。原代码中 10 表示 10秒。
■ <LINK> : ▲Top

  <LINK> 用来将目前文件与其它 URL 作链结,但不会有链接按钮,用于 <HEAD> 标记间,格式如下:

  <link href="URL" rel="relationship">
  <link href="URL" rev="relationship">

  其用法我们会于 Style Sheet 样式表一节详细介绍。

阅读全文

 

■ 清单标记

<OL> <LI>
<UL>
<MENU> <DIR>
<DL> <DT> <DD>

  欲明白本篇【HTML彻底剖析】之标记分类,请看 【标记一览】。
  也请先明白围堵标记与空标记的分别,请看 【HTML概念】。

■ <OL> <LI> : ▲Top


  <OL>称为顺序清单标记。<LI>则用以标示清单项目。
  所谓顺序清单就是在每一项前加上 1,2,3... 等数字,又称编号清单。

  <OL> 的参数设定(常用):
  例如: <ol type="i" start="4"></ol>

type="i"
设定数目款式,其值有五种,请参考右表,默认为 type="1"。
start="4"
设定开始数目,不论设定了哪一数目款式,其值只能是 1,2,3.. 等整数,默认为 start="1"。
 Type Numbering style
1 arabic numbers 1, 2, 3, ...
a lower alpha a, b, c, ...
A upper alpha A, B, C, ...
i lower roman i, ii, iii, ...
I upper roman I, II, III, ...
 


  <LI> 的参数设定(常用):
  例如: <li type="square" value="4">

type="square"
只适用于非顺序清单,设定符号款式,其值有三种,如下,默认为 type="disc":
符号  是当 type="disc" 时的列项符号。
符号  是当 type="circle" 时的列项符号。
符号  是当 type="square" 时的列项符号。
value="4"
只适用于顺序清单,设定该一项的数目,其后各项将以此作为起始数目面递增, 但前面各项则不受影响,其值只能是 1,2,3.. 等整数,没有默认值。
例子: HTML Source Code (原代码) 浏览器显示结果
My best friends:
<ol>
<li>Michelle Wei
<li>Michael Wan
<li>Gloria Lam
</ol>  My best friends:
Michelle Wei
Michael Wan
Gloria Lam
 

■ <UL> : ▲Top


  <UL>称为无序清单标记。
  所谓无序清单就是在每一项前面加上 、、 等符号,故称符号清单。

  <UL> 的参数设定(常用):
  例如: <UL type="square">

type="square"
设定符号款式,其值有三种,如下,内定值为 type="disc":
符号  是当 type="disc" 时的列项符号。
符号  是当 type="circle" 时的列项符号。
符号  是当 type="square" 时的列项符号。
注意:由于 <UL> 及 <LI> 都有 type 这个参数,两者尽可能选其一。

例子: HTML Source Code (原代码) 浏览器显示结果
My Homepages:
<ul>
<li>Penpals Garden
<li>ICQ Garden
<li>Software City
<li>Creation of Webpage
</ul>  My Homepages:
Penpals Garden
ICQ Garden
Software City
Creation of Webpage
 

■ <MENU> <DIR> : ▲Top


  这两个标记不为 W3C 所赞同,希望使用者能以 <ul> 及 <ol> 代替。
  <MENU> 及 <DIR>,基本上它和 <ul> 是一样的,在一些特别的浏览器可能表现出 <ol> 的效果,于旧版的 IE 或 NC 标记 <DIR> 不显示符号或数目。两标记的用法与 <ul> 完全一样。

例子: HTML Source Code (原代码) 浏览器显示结果
My Homepages:
<dir>
<li>Penpals Garden
<li>ICQ Garden
<li>Software City
<li>Creation of Webpage
</dir>  My Homepages:
Penpals Garden
ICQ Garden
Software City
Creation of Webpage
 

■ <DL> <DT> <DD> : ▲Top


  <DL>称为定义清单标记。 <DT> 用以标记定义条目,<DD> 则用以标记定义内容。
所谓定义清单就是一种分两层的项目清单,其不带有符号及数目。

  三个标记都没有常用参数。而 <DT> <DD> 可以独立使用,只是一些旧的浏览器不支持,如 IE 3.0。常用的如 <DD> 标记可用以制造段落第一个字前的空白。

例子: 原代码 <dl>
<dt>How to use Definition List
<dd>First, you should not place paragraph tag right after or before a list structure or between the items of a list. In cerntain contexts, use of extra paragraph tags should always be avoided, when you realize this concept, it is quit easy to write a HTML.
<dt>Other things to know
<dd>We usually put only ONE Definition tag following the Definition Term tag, more than one DD tag is not recommanded. Besides, unlike Definition List is a nonempty tag, both Definition Term and Definition Description are empty tags.
</dl> 
显示结果 How to use Definition List
First, you should not place paragraph tag right after or before a list structure or between the items of a list. In cerntain contexts, use of extra paragraph tags should always be avoided, when you realize this concept, it is quit easy to write a HTML.
Other things to know
We usually put only ONE Definition tag following the Definition Term tag, more than one DD tag is not recommanded. Besides, unlike Definition List is a nonempty tag, both Definition Term and Definition Description are empty tags. 

阅读全文

 

■ 常用特殊字符:

只要你认识了 HTML 标记,你便会知道特殊字符的用处。

HTML 原代码 显示结果 描述
&lt; < 小于号或显示标记
&gt; > 大于号或显示标记
&amp; & 可用于显示其它特殊字符
&quot; " 引号
&reg; ® 已注册
&copy; © 版权
&trade; ™ 商标
&ensp;  半个空白位
&emsp;  一个空白位
&nbsp;  不断行的空白


■ ISO Latin-1 特殊字符 :


HTML 原代码 显示结果 描述
&AElig; Æ Uppercase AE diphthing
&Aacute; Á Uppercase A, acute accent
&Acirc; Â Uppercase A, circumflex accent
&Agrave; À Uppercase A, grave accent
&Aring; Å Uppercase A, ring
&Atilde; Ã Uppercase A, tilde
&Auml; Ä Uppercase A, dieresis or umlaut mark
&Ccedil; Ç Uppercase C, cedilla
&ETH; Ð Uppercase Eth, Icelandic
&Eacute; É Uppercase E, acute accent
&Ecirc; Ê Uppercase E, circumflex accent
&Egrave; È Uppercase E, grave accent
&Euml; Ë Uppercase E, dieresis or umlaut mark
&Iacute; Í Uppercase I, acute accent
&Icirc; Î Uppercase I, circumflex accent
&Igrave; Ì Uppercase I, grave accent
&Iuml; Ï Uppercase I, dieresis or umlaut mark
&Ntilde; Ñ Uppercase N, tilde
&Oacute; Ó Uppercase O, acute accent
&Ocirc; Ô Uppercase O, circumflex accent
&Ograve; Ò Uppercase O, grave accent
&Oslash; Ø Uppercase O, slash
&Otilde; Õ Uppercase O, tilde
&Ouml; Ö Uppercase O, dieresis or umlaut mark
&THORN; Þ Uppercase THORN, Icelandic
&Uacute; Ú Uppercase U, acute accent
&Ucirc; Û Uppercase U, circumflex accent
&Ugrave; Ù Uppercase u, grave accent
&Uuml; Ü Uppercase U, dieresis or umlaut mark
&Yacute; Ý Uppercase Y, acute accent
&aelig; æ Lowercase ae diphthing
&aacute; á Lowercase a, acute accent
&acirc; â Lowercase a, circumflex accent
&agrave; à Lowercase a, grave accent
&aring; å Lowercase a, ring
&atilde; ã Lowercase a, tilde
&auml; ä Lowercase a, dieresis or umlaut mark
&ccedil; ç Lowercase c, cedilla
&eth; ð Lowercase eth, Icelandic
&eacute; é Lowercase e, acute accent
&ecirc; ê Lowercase e, circumflex accent
&egrave; è Lowercase e, grave accent
&euml; ë Lowercase e, dieresis or umlaut mark
&iacute; í Lowercase i, acute accent
&icirc; î Lowercase i, circumflex accent
&igrave; ì Lowercase i, grave accent
&iuml; ï Lowercase i, dieresis or umlaut mark
&ntilde; ñ Lowercase n, tilde
&oacute; ó Lowercase o, acute accent
&ocirc; ô Lowercase o, circumflex accent
&ograve; ò Lowercase o, grave accent
&oslash; ø Lowercase o, slash
&otilde; õ Lowercase o, tilde
&ouml; ö Lowercase o, dieresis or umlaut mark
&szlig; ß Lowercase sharp s, German (sz ligature)
&thorn; þ Lowercase thorn, Icelandic
&uacute; ú Lowercase u, acute accent
&ucirc; û Lowercase u, circumflex accent
&ugrave; ù Lowercase u, grave accent
&uuml; ü Lowercase u, dieresis or umlaut mark
&yacute; ý Lowercase y, acute accent
&yuml; ÿ Lowercase y, dieresis or umlaut mark

阅读全文

 

■ 图形标记

<IMG>

  欲明白本篇【HTML彻底剖析】之标记分类,请看 【标记一览】。
  也请先明白围堵标记与空标记的分别,请看 【HTML概念】。


■ <IMG> :
  <IMG> 称图形标记,主要用来插入图形标记,主要用来插入图片于网页中,至于其它用处如配合影片档案等的播放 及影像地图(Image Map 或称一图多链接)则不会在此节讲述,请看【影像地图】及【其他标记】。

  <IMG> 的一般参数设定:

  例如 <img src="logo.gif" width=100 height=100 hspace=5 vspace=5 border=2 align="top" alt="Logo of PenPals Garden" lowsrc="pre_logo.gif">

src="logo.gif"
图片来源,接受 .gif, .jpg 及 .png 格式,前两者通行已久,后者则由 96 年开始发展, 于未来取代前两者。若图片档与该 html 档同处一目录则只需写上档案名称,否则 必须加上正确的路径,相对或绝对均可。
width=100 height=100
设定图片大小,此宽度及高度一般采用 pixels 作单位。通常只设为图片的真实 大小,以免失真,若需要改图片大小最好使用图像编辑工具。
hspace=5 vspace=5
设定图片边沿空白,以免文字或其它图片贴近。hspace 是设定图片左右的空间, 是设定图片上下的空间,高度采用 pixels 作单位。
border=2
图片边框厚度。
align="top"
调整图片旁边文字的位置,你可以控制文字出现在图片的偏上方、中间、底部、 左右等,可选值:top, middle, bottom, left, right,内定为 botom。Netscape 还支持 texttop, baseline, absmiddle, absbottom,
texttop 表示图片和文字依顶线对齐,
baseline 表示图片对齐到目前文字行底线值,
absmiddle 表示图片对齐到目前文字行绝对中央,
absbottom 表示图片对齐到目前文字行绝对底部,(绝对底部是指它考虑到比如 y 、g、q 等字的下边)。
alt="Logo of PenPal Garden"
这是用以描述该图形的文字,若使用文字浏览器,由于不支持图片,这些文字 将会代替图片被显示。若支持图片的浏览器,当鼠标移至图片上该文字也会显示。
lowsrc="pre_logo.gif"
设定先显示低解析度的图片,若加入的是一张很大的图片,下载要很长的时间,这张低 解析度的图片会先被显示以免浏览者失去兴趣,通常是原图的黑白版本。
例子一: 原代码 <img src="girl.gif" width=100 height=112 border=0 alt="beautiful girl"> 普通插入 
显示结果  普通插入 


例子二: 原代码 <img src="girl.gif" width=100 height=112 border=0 alt="beautiful" hspace=10 vspace=20"> 设定上下左右空白位置 
显示结果  设定上下左右空白位置 


例子三: 原代码 <img src="girl.gif" width=100 height=112 border=4 alt="beautiful" hspace=10 vspace=20"> 设定上下左右空白位置 
显示结果  设定图片中间对齐,边框厚度为 4。 


例子四: 原代码 <img src="girl.gif" width=100 height=112 alt="beautiful lady" align="right" border=0> 设定图片靠右。 
显示结果  设定图片靠右。 


例子五: 原代码 <img src="girl.gif" width=200 height=220 alt="I'm not beautiful right now" border=0> 放大了的图片 
显示结果 

 
 

阅读全文

 

■ 影像地图

<MAP> <AREA>

  欲明白本篇【HTML彻底剖析】之标记分类,请看 【标记一览】。
  也请先明白围堵标记与空标记的分别,请看 【HTML概念】。

■ <MAP> <AREA>:

  相信不会太多人手动设定 Image Map,通常使用网页编辑部工具的向导,那是很方便的方法,至于 <MAP> <AREA> 的详细的介绍,我们以后有空会补上。
 

阅读全文

■ 字体标记

<STRONG> <B>
<I> <EM> <VAR> <CITE> <DFN> <ADDRESS>
<TT> <SAMP> <CODE> <KBD> <U> <STRIKE> <BIG> <SMALL> <SUP> <SUB>
<H1> <H2> <H3> <H4> <H5> <H6>
<FONT> <BASEFONT>

  欲明白本篇【HTML彻底剖析】之标记分类,请看 【标记一览】。
  也请先明白围堵标记与空标记的分别,请看 【HTML概念】。

■实体标记与逻辑标记 : ▲Top


  这一节【字体标记】你必须先明白实体标记与逻辑标记的分别,否则你会迷惑于为何不同 的标记却有相同的效果。两者分别有以下两处:

  1、实体标记有固定的显示效果,逻辑标记标记则依不同浏览器而不同。

  例如逻辑标记的 <EM> 由于浏览器的不同它所标示的文字不一定出现斜体效果, 它可能是加底线、粗体或反白等,所以这一节是以它们在 IE 和 NC 中的效果作介绍。

  2、多个实体标记也可有效标示同一字句,逻辑标记则通常于浏览器不能有效显示多 重的标示。

  例如两个逻辑标记 <EM> 及 <STRONG> 同时标示一字句于旧浏览器常失去作用。


实体标记有:
<I> <B> <U>
逻辑标记有:
<STRONG> <EM> <VAR> <CITE> <DFN> <ADDRESS> <CODE> <KBO> <SAMP> <TT>
  若要求真确的效果当然以实体标记为佳。

■<STRONG> <B> : ▲Top


  两者皆能产生字体加粗效果,但必须注意的是当文件编码被设为汉字时,两者所标示的中文字不会在 Netscape Netvigator 显示粗体效果。

例子: (第一行是没有任何字体标记的,作参照用) HTML Source Code (原代码) 浏览器显示结果
Creation of Webpage
<br><STRONG>Creation of Webpage</STRONG>
<br><B>Creation of Webpage</B>  Creation of Webpage
Creation of Webpage
Creation of Webpage 

■<I> <EM> <VAR> <CITE> <DFN> <ADDRESS>: ▲Top


  这些标记在 Internet Explorer 里都会产生斜体效果,而只有 </DFN> 于 Netscape Netvigator 失去作用。这些标记中只有 <ADDRESS> 较为特别,因为它包括换行效果所以不必在它前面加上 <BR> 标记。

例子: HTML Source Code (原代码) 浏览器显示结果
<I>Creation of Webpage</I>
<br><EM>Creation of Webpage</EM>
<br><VAR>Creation of Webpage</VAR>
<br><CITE>Creation of Webpage</CITE>
<br><DFN>Creation of Webpage</DFN>
<ADDRESS>Creation of Webpage</ADDRESS>  Creation of Webpage
Creation of Webpage
Creation of Webpage
Creation of Webpage
Creation of Webpage
Creation of Webpage

■<TT> <SAMP> <CODE> <KBD> <U> <STRIKE> <BIG> <SMALL> <SUP> <SUB> ▲Top


  为方便对照及记认,所以把十个标记放在一起介绍。

<TT> <SAMP> <CODE> <KBD> 可令每字母有相等宽度且每个字母之间的距离稍微加宽。但于 NC 不见得如此。
<U> 是加底线的标记,一些特别的浏览器并不支持,因顾虑到与链接混淆。
<STRIKE> 加上删除线的标记。
<BIG> 令字体加大。
<SMALL> 令字体变细。
<SUB> 为下标字, <SUP> 则为上标字,仅剩的数学标记。
例子: (第一行是没有任何字体标记的,作参照用) HTML Source Code (原代码) 浏览器显示结果
Creation of Webpage
<br><TT>Creation of Webpage</TT>
<br><SAMP>Creation of Webpage</SAMP>
<br><CODE>Creation of Webpage</CODE>
<br><KBD>Creation of Webpage</KBD>
<br><U>Creation of Webpage</U>
<br><STRIKE>Creation of Webpage</STRIKE>
<br><BIG>Creation of Webpage</BIG>
<br><SMALL>Creation of Webpage</SMALL>
<br>12345<SUB>7</SUB> 6789<SUP>9</SUP>  Creation of Webpage
Creation of Webpage
Creation of Webpage
Creation of Webpage
Creation of Webpage
Creation of Webpage
Creation of Webpage
Creation of Webpage
Creation of Webpage
123457 67899 

■<H1> <H2> <H3> <H4> <H5> <H6>: ▲Top


  这些标记是标题标记,由 <H1> 到 <H6> 逐渐变小。每个标题标记所标示的字句将独占一行且上下留一空白行。

例子: 原代码 <H1>Header Level 1</H1>
<H2>Header Level 2</H2>
<H3>Header Level 3</H3>
<H4>Header Level 4</H4>
<H5>Header Level 5</H5>
<H6>Header Level 6</H6> 
显示结果 Header Level 1
Header Level 2
Header Level 3Header Level 4
Header Level 5
Header Level 6

■<FONT> <BASEFONT>: ▲Top


  这一节只有这两个标记具参数设定,且两者的参数设定是一样的,都是负责设定文字的大小、 字型及颜色,但各有用处,且看以下比较:

<BASEFONT> 可以用于文件开头部分,即 <HEAD> 与 </HEAD> 之间的位置,将 影响全文字句,是一个空标记,用以改变字体显示的内定值。
<FONT> 是应用于文件的内文部分,即 <BODY> 与 </BODY> 之间的位置,只影响 所标示的字句,是一个围堵标记。
两标记可同时存在,唯没被 <FONT> 所标示的字句才直接受 <BASEFONT> 所影 响,而 <FONT> 本身也受 <BASEFONT> 的影响。
  <FONT>的参数设定:

  例子: <font face="Arial" size="+2" color="#008000">Creation of Webpage</font>


face="Arial"
设定文字的字形。Arial 是常用的一种,请不要使用 Window 附带字 体以外的字体。对于没有设定为中文代码的中文网页,Netscape Netvigator 不会显示此标记 所指明的任何中文字体。
size="+2"
设定文字的大小。其值可以是绝对或相对,
绝对的意思是标记自己决定文字的大小,不受 <BASEFONT> 的影响,如
size="5" 表示其大小便是 5, 而html内定值为 3,即 size="3"和没设定是一样的。
相对的意思是在默认值 3 基础上增大或缩小的级数,如 size="+2" 便等同绝 对表示法的 size="5",蓝天若已设定 <BASEFONT size="n"> 则其实际大小便是 n+2 不 再是 3+2 了。<BASEFONT>只有绝对表示法。
color="#008000"
设定文字的颜色。#008000 表示绿色,各类颜色值及调色法请参考【调色原理】
例子: 原代码 <font size="+1">I love Creation of Webpage</font>
<br><font size="+2" color="#800080">I love Creation of Webpage</font>
<br><font face="Times New Roman" size="5" color="#008000">I love Creation of Webpage</font> 
显示结果 I love Creation of Webpage
I love Creation of Webpage
I love Creation of Webpage 

阅读全文

共有326条信息 1 - 20 1/17页 20个/页  上一页 下一页

转到:

关于本站  |  版权声明 | 合作联系 | 网站地图 | 帮助中心 |  | XHTML/CSS
Copyright © 2006-2011 365codes.net 程序支持:木翼 苏ICP备11019266号