⭐ 欢迎来到虫虫下载站! | 📦 资源下载 📁 资源专辑 ℹ️ 关于我们
⭐ 虫虫下载站

📄 7-1.cfm.htm

📁 最全的ASP教程
💻 HTM
📖 第 1 页 / 共 2 页
字号:
<html>

<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>本章讲述标准HTML中的一些高级标识符</title>
<meta name="GENERATOR" content="Microsoft FrontPage 3.0">
</head>

<body>
<font FACE="宋体" SIZE="3">

<p ALIGN="JUSTIFY">本章讲述标准HTML中的一些高级标识符,你将学习怎样建立image 
map来使你的网点易于浏览,你还会学习怎样使用窗口和框架来同时显示多个网页,最后你将学习怎样通过cascading 
style sheets来更好地控制你网页的布局。</p>
</font><font FACE="宋体" SIZE="5"><b>

<p ALIGN="JUSTIFY">使用image map</p>
</b></font><font FACE="宋体" SIZE="3">

<p ALIGN="JUSTIFY">许多网点的主页都有一幅图象,你可以点击它的不同部位来进入网点的不同部分(见图7.1)。例如,这幅图象可以包含一些图标,指定为新闻部分。对话部分及下载部分,如果这个网点的参观者想从主页立即进入新闻部分,他就可以简单地点击一下新闻的图标,包含有这些图标的图象就被称为image 
map。</p>

<p ALIGN="JUSTIFY"><img SRC="Image56.gif" tppabs="http://210.74.168.175/guide/asp/part7/Image56.gif" WIDTH="590" HEIGHT="403"></p>
<b>

<p ALIGN="CENTER">图7.1 一个image map的例子</p>
</b>

<p ALIGN="JUSTIFY">image map的另一个用途是在网点的每一页的顶部建立导航条,导航条包含了这个网点主要部分的菜单。同样,用户可以用导航条快速而简单地进入他所感兴趣的部分。例如,Netscape的网点上许多网页都有一个导航条(见图7.2)。</p>

<p ALIGN="JUSTIFY">这是image map的两个主要用途,然而只要我们去想,它还有很多别的用途。例如,你可以使用image 
map来搜集信息,假如你想知道参观你网点的人是来自世界的哪个角落,你就可以建立一幅世界地图的image 
map,参观者可通过点击地图来指出他们来自哪个国家。如果你想在一幅图象上显示一系列选择,就要使用image 
map。</p>

<p ALIGN="JUSTIFY">有两种类型的image map:服务器端的及客户端的,当你使用服务器端image 
map时,服务器会在用户点击了图象上某一部位时决定采取什么行动;而在客户端image 
map中,则是由浏览器决定采取什么行动。服务器端image map与更多的浏览器有更好的兼容性,但是客户端image 
map更快。两种image map都很容易建立,下面的两节将分别介绍这两种类型。</p>

<p ALIGN="JUSTIFY"><img SRC="Image57.gif" tppabs="http://210.74.168.175/guide/asp/part7/Image57.gif" WIDTH="595" HEIGHT="412"></p>
<b>

<p ALIGN="CENTER">图7.2 具有导航条的Netscape的网页</p>
</font><font FACE="宋体">

<p ALIGN="JUSTIFY">服务器端image map</p>
</font></b><font FACE="宋体" SIZE="3">

<p ALIGN="JUSTIFY">如果你想让你的image map在更多的浏览器上都能正确运行的话,就使用服务器端image 
map,它甚至能很好地与早期的浏览器兼容。它唯一的一个不利之处是它比客户端image 
map要慢许多。</p>

<p ALIGN="JUSTIFY">建立一个服务器端image map需要以下三步:</p>

<blockquote>
  <blockquote>
    <p ALIGN="JUSTIFY">建立图象</p>
    <p ALIGN="JUSTIFY">在HTML文件中使用正确的标识符</p>
    <p ALIGN="JUSTIFY">建立image map</p>
  </blockquote>
  <p ALIGN="JUSTIFY">下面将对此进行详细的讨论。</p>
</blockquote>

<p ALIGN="JUSTIFY">你可以在image map中使用任何类型的图象,一般使用GIF,但你也可以使用JPEG或PNG格式的图象,这对于image 
map来说没有什么差别。你可以用任何一种支持网页图象格式的作图软件来建立你的图象。</p>

<p ALIGN="JUSTIFY">在建立图象时,要确保它的尺寸足够大,能使用户轻松地用鼠标点击不同的部位。如果你建立的图象太小,用户点击正确的区域会很吃力,这会降低用户的兴趣。同时也不要使图象太大,否则图象调入浏览器会非常地慢。Internet上有很多网点在它们的主页上都放置了过大的image 
map(社团的网点更是这样)。你的图象很具有艺术性,但如果要花几个小时来读入它的话,就没有人愿意去看它。</p>

<p ALIGN="JUSTIFY">建立服务器端image map的第二步是在HTML文件中包含必需的HTML标识符,你可以使用&lt;IMG&gt;的ISMAP属性来指定一幅图象为服务器端image 
map。下面是个例子:</p>

<p ALIGN="JUSTIFY">&lt;HTML&gt;</p>

<p ALIGN="JUSTIFY">&lt;HEAD&gt; &lt;TITLE&gt; Server-Side Image Map &lt;/TITLE&gt; 
&lt;/HEAD&gt;</p>

<p ALIGN="JUSTIFY">&lt;BODY&gt;</p>

<p ALIGN="JUSTIFY">&lt;A HREF=“/somedirectory/mymap.map”&gt; &lt;IMG SRC=“myimage.gif” 
ISMAP&gt; &lt;/A&gt;</p>

<p ALIGN="JUSTIFY">&lt;/BODY&gt;</p>

<p ALIGN="JUSTIFY">&lt;/HTML&gt;</p>

<p ALIGN="JUSTIFY">这个例子假设你已经建立了一幅名为myimage.gif的GIF图象,这幅图象是用来作为image 
map的。ISMAP属性通知浏览器将这幅图象解释为image map而不是一般的图象。</p>

<p ALIGN="JUSTIFY">你可以使用&lt;IMG&gt;标识符的所有属性,例如,你可以用BORDER=0属性来防止在Netscape 
Navigator上显示时在图象周围画一个边框。</p>

<p ALIGN="JUSTIFY">建立一个服务器端image map的最后一步是建立一个地图文件。地图文件是具有扩展名为 
.map的一般文本文件,你可以使用任何一种普通的文本编辑软件来建立地图文件。在上例中,注意图象是包含在&lt;A&gt;标识符中,然而HREF属性不是通常那样指向一个HTML文件,而是指向一个名为mymap.map的文件,这就是个地图文件。</p>

<p ALIGN="JUSTIFY">一个地图文件将图象中不同的区域与不同的网络地址(URL)关联起来。例如,假设你的图象上有一个报纸的图标,还有一个聊天室的图标,如果有人点击了报纸图标,你希望浏览器调入新闻的网页,如果点击了聊天室的图标,你希望调入聊天室的网页。要建立这种图象与网页间的联系,你必须使用地图文件。</p>

<p ALIGN="JUSTIFY">Internet Information Server(本书假定你在使用的Web服务器)能识别NCSA和CERN格式的地图文件。下面的例子是一个NCSA格式的地图文件:</p>

<p ALIGN="JUSTIFY"># WWW NCSA Image Map file for</font><font SIZE="3">‘</font><font
FACE="宋体" SIZE="3">myimage.gif </font><font SIZE="3">’</p>
</font><font FACE="宋体" SIZE="3">

<p ALIGN="JUSTIFY">default /home.cfm</p>

<p ALIGN="JUSTIFY">rect /news.cfm 0,0 100,100</p>

<p ALIGN="JUSTIFY">rect /chat.cfm 101,0 200,100</p>

<p ALIGN="JUSTIFY">在这个地图文件中,符号#表明一句注释的开始,你可以在#号后输入任何你想要的文字。在此例中,注释中说明了与地图文件相关的图象文件名。当你有多幅image 
map时,这是个好的习惯,通过在地图文件中指明图象的名字,你可以记住哪个图象与哪个地图文件相关。</p>

<p ALIGN="JUSTIFY">代码rect用来将图象中的一个矩形区与一个HTML文件地址相关联,例如,news.cfm文件与坐标为0,0和100,100定义的矩形区相关联。这个坐标指明了图象上的一个区域,左上角坐标为(0,0),右下角坐标为(100,100)。当用户点击了图象上的这个区域后,HTML文件news.cfm就会被调入浏览器。</p>

<p ALIGN="JUSTIFY">最后,代码default指明了当用户点击image map上未被定义的区域时,浏览器应当调入的HTML文件。在此例中,如果用户点击了上述定义的两个矩形区域之外,浏览器就会调入</font><a
HREF="javascript:if(confirm('http://home.cfm/  \n\n文件并未按 Teleport Pro 取回, 因为 它的域或路径超过启始网址中设定的范围。  \n\n你要从服务器上打开它吗? '))window.location='http://home.cfm/'" tppabs="http://home.cfm/"><font FACE="宋体" SIZE="3" COLOR="#0000ff"><u>home.cfm</u></font></a><font
FACE="宋体" SIZE="3">文件。</p>

<p ALIGN="JUSTIFY">在这个地图文件中,定义的区域是矩形的,但是你也可以使用别的形状,例如圆形、多边形,甚至是单独的点(如果你觉得有必要的话)。下面的例子使用了所有这四种形状的区域:</p>

<p ALIGN="JUSTIFY"># WWW NCSA Image Map file for</font><font SIZE="3">‘</font><font
FACE="宋体" SIZE="3">myimage.gif </font><font SIZE="3">’</p>
</font><font FACE="宋体" SIZE="3">

<p ALIGN="JUSTIFY">default /home.cfm</p>

<p ALIGN="JUSTIFY">rect /news.cfm 0,0 100,100</p>

<p ALIGN="JUSTIFY">circle /chat.cfm 50,50 20</p>

<p ALIGN="JUSTIFY">poly /help.cfm 200,0 400,0 400,100 200,100 200,0</p>

<p ALIGN="JUSTIFY">point /NeverGetHere.cfm 500,6</p>

<p ALIGN="JUSTIFY">在这个地图文件中,代码circle在地图上定义了一个圆心在(50,50),半径在20的圆形区域,poly定义了一个由一系列的点(给出X、Y坐标)组成的多边形区域,最后point定义了一个单独的点,要想调入HTML文件NeverGetHere.cfm,用户必须点击图象上坐标为(500,6)的单个点。</p>

⌨️ 快捷键说明

复制代码 Ctrl + C
搜索代码 Ctrl + F
全屏模式 F11
切换主题 Ctrl + Shift + D
显示快捷键 ?
增大字号 Ctrl + =
减小字号 Ctrl + -