第4章 用HTML建立超鏈接課件_第1頁
第4章 用HTML建立超鏈接課件_第2頁
第4章 用HTML建立超鏈接課件_第3頁
第4章 用HTML建立超鏈接課件_第4頁
第4章 用HTML建立超鏈接課件_第5頁
已閱讀5頁，還剩25頁未讀， 繼續(xù)免費閱讀

下載本文檔

版權(quán)說明：本文檔由用戶提供并上傳，收益歸屬內(nèi)容提供方，若內(nèi)容存在侵權(quán)，請進(jìn)行舉報或認(rèn)領(lǐng)

文檔簡介

第四章用HTML建立超鏈接4.1設(shè)置基本文字超鏈接建立HTML標(biāo)記為<a></a>標(biāo)記。超鏈接最重要的兩個要素，設(shè)置為超鏈接到文本內(nèi)容和超鏈接指向的目標(biāo)地址。基本超鏈接的結(jié)構(gòu)如下：<ahref=“”>百度</a>鏈接標(biāo)記屬性地址鏈接文本URL的格式每個文檔在互聯(lián)網(wǎng)上有唯一的地址，該地址被稱為統(tǒng)一資源定位器（UniformResourceLaocator）,簡稱URL。URL由四個部分組成：協(xié)議、主機(jī)名、文件夾名和文件名。

http:///study/index.html協(xié)議主機(jī)名文件夾名文件名URL的類型超鏈接的URL有兩種類型：絕對URL和相對URL。絕對URL如下：/study/index.html相對URL分為兩種：1、相對文檔的URL，這種URL以鏈接的原文檔為起點。2、相對服務(wù)器的URL，這種URL以服務(wù)器的根目錄為前點。URL的類型<html><head><title>超鏈接</title></head><body><p>點擊<ahref="/guest-book.html">鏈接01</a>鏈接到第1個網(wǎng)頁。</p><p>點擊<ahref="/02.html">鏈接02</a>鏈接到第2個網(wǎng)頁。</p><p>點擊<ahref="../sub/03.html">鏈接03</a>鏈接到第3個網(wǎng)頁。</p></body></html>絕對URL服務(wù)器相對URL文檔相對URL絕對URL和文檔相對URL比較常用。4.2設(shè)置頁面內(nèi)部特定目標(biāo)的鏈接超鏈接不僅可以跳轉(zhuǎn)到其他頁面，也可以在本業(yè)內(nèi)跳轉(zhuǎn)。二者的跳轉(zhuǎn)目標(biāo)名稱必須要一致4.2設(shè)置頁面內(nèi)部特定目標(biāo)的鏈接<html><head><title>無標(biāo)題文檔</title></head><body><p><ahref="#first">第1本書</a><ahref="#second">第2本書</a><ahref="#third">第3本書</a></p><h3><aname=“third"></a>精通CSS+DIV網(wǎng)頁樣式與布局</h3><p>本書系統(tǒng)地講解了CSS層疊樣式表的……能力。</p><p>詳細(xì)介紹</p><h3><aname="second"></a>CSS設(shè)計徹底研究</h3><p>本書是一本深入研究和揭示CSS設(shè)計技術(shù)的書籍。本書在……以然。<br>詳細(xì)介紹</p><h3><aname="third"></a>CSS設(shè)計禪意花園</h3><p>本書作者是世界著名的網(wǎng)站設(shè)計師，……性能優(yōu)良且具有強(qiáng)大生命力的網(wǎng)站。<br></body></html>4.3設(shè)置圖片的超鏈接<html><head><title>圖片的超鏈接</title></head><body><ahref=1.html><imgsrc=cup.gif></a><br></body></html>4.3設(shè)置圖片的超鏈接為圖片添加一個超鏈接后，瀏覽器就會自動給圖片加上一個粗邊框，就像在建立文字超鏈接時會加上下劃線一樣。如果希望去掉這個邊框，只需要在<img>標(biāo)記中設(shè)置border=“1”后就可以取消這個邊框。<ahref=1.html><imgsrc=cup.gifborder=“0”></a>4.4設(shè)置電子郵件鏈接電子郵件鏈接類似于URL的鏈接方式，格式是mailto:電子郵件地址。<html><head><title>郵件的鏈接</title></head><body>聯(lián)系我們：<ahref="mailto:479384554@">給我們發(fā)送郵件</a>。</body></html>4.5設(shè)置以新窗口顯示鏈接頁面如果要在點擊某個鏈接以后，打開一個新的瀏覽器窗口，在這個新窗口里顯示目標(biāo)頁面，就需要在<a>標(biāo)記中設(shè)置”target”屬性。Target屬性設(shè)置為“_blank”，就會自動打開一個新窗口，顯示目標(biāo)頁面。4.5設(shè)置以新窗口顯示鏈接頁面<html><head><title>以新窗口方式打開</title></head><body>以<ahref="1.html"target="_blank">新窗口</a>方式打開一個頁面。</body></html>4.6創(chuàng)建熱點區(qū)域所謂圖片的熱點區(qū)域就是將一個圖片劃分成若干個鏈接區(qū)域。訪問者點擊不同區(qū)域會鏈接到不同的目標(biāo)頁面。HTML中可以使用3種類型的熱點區(qū)域：矩形、圓形和多邊形。4.6創(chuàng)建熱點區(qū)域<imgsrc="hotmap.jpg"width="542"height="266"border="0"usemap="#1"><mapname=“1"><areashape="rect"coords="25,71,168,185"href="2.html"target="_blank">

矩形左上右下鏈接地址4.6創(chuàng)建熱點區(qū)域<areashape="circle"coords="302,124,59"href="2.html"target="_parent"><areashape="poly"coords="447,198,438,183,384,106,391,48,469,26,509,101,483,150"href="2.html"target="_self"></map>左上半徑各點坐標(biāo)4.6創(chuàng)建熱點區(qū)域在設(shè)計窗口中定位熱點區(qū)域：4.6創(chuàng)建熱點區(qū)域1、創(chuàng)建新文檔，插入圖片。2、在屬性面板中選擇要創(chuàng)建的熱點類型（矩形、圓形、多邊形）3、畫區(qū)域4、指針熱點進(jìn)行調(diào)整5、輸入跳轉(zhuǎn)的目標(biāo)頁面6、選擇跳轉(zhuǎn)方式4.7框架之間的鏈接框架是一種常用網(wǎng)頁布局工具。它的作用是把瀏覽器的顯示空間劃分為幾個部分，每個部分都可以獨立顯示不同的頁面。建立框架與框架集（<frame><frameset>）<frameset>和</frameset>標(biāo)記是與<body>和</body>同級的，因此，不要將<frameset>和</frameset>標(biāo)記包含在<body>標(biāo)記中，否則<frameset>標(biāo)記將無法正常使用。用cols屬性將窗口分為左右兩部分窗口框架的分割方式有兩種，一種是水平分割，另一種是垂直分割。在<frameset>標(biāo)記中的cols屬性和rows屬性用來控制窗口的分割方式。Cols屬性可以將一個框架集分割為若干列，其中語法結(jié)構(gòu)是：<framesetcols=“n1,n2……，*”>N1表示窗口1的的寬度，以像素或百分比為單位*表示分配給前面所有窗口后剩下的寬度。比如<framesetcols=“20%,30%,*”>,那么星號就代表50%用rows屬性將窗口分為上中下三部分<html><head><title></title></head><framesetrows=“30%,40%,*”><frame><frame></frameset></html>框架的嵌套Rows屬性和cols屬性也可以混合起來使用，實現(xiàn)框架的嵌套。<html><head><title></title></head><framesetrows=“30%,*”><frame><framesetrows=“60%,*”><frame><frame></frameset></frameset></html>用src屬性在框架中插入網(wǎng)頁其語法結(jié)構(gòu)如下：<framesrc=HTML文件的位置><html><head><title></title></head><framesetrows=“40%,*”><framesrc=1.htm><framesrc=2.htm></frameset></html>用src屬性在框架之間鏈接（P63）Target的四種屬性：_blank:表示新打開一個瀏覽器窗口，在其中顯示鏈接的目標(biāo)頁面。_self:相當(dāng)于不設(shè)置target屬性，窗口中顯示鏈接的目標(biāo)頁面。_top:表示在頂級框架，也就是在瀏覽器窗口中顯示鏈接的目標(biāo)頁面。_partent：表示在上一級框架中顯示鏈接的目標(biāo)頁面。創(chuàng)建嵌入式框架<iframe>也稱為“浮動框架”，可以自由控制窗口的大小。在使用的時候不需要創(chuàng)建框架集，直接插入<iframe>即可。<iframewidth=800height=200src=1.htm></iframe>4.8鏈接增多后網(wǎng)站的組織結(jié)構(gòu)與維護(hù)通常在開發(fā)網(wǎng)站的時候，并不是把所有的網(wǎng)頁文件都保存在一個站點根目錄下，而是使用不同的文件夾存放不同性質(zhì)的文件。建立起合適的網(wǎng)站文件存儲結(jié)果，能迅速定位自己需要的文件，或者將制作完成的文件存儲到相應(yīng)的目錄中，進(jìn)行網(wǎng)站的開發(fā)工作。4.8鏈接增多后網(wǎng)站的組織結(jié)構(gòu)與維護(hù)方案一將不同類型的文件存放在不同的文件夾中，這種存儲方法使用于中小型的網(wǎng)站，該方法是用過文件的類型對文件進(jìn)行管理。例如：將圖片文件都放在Pic文件夾中，將聲音文件都放在sounds文件夾中

溫馨提示

  • 1. 本站所有資源如無特殊說明，都需要本地電腦安裝OFFICE2007和PDF閱讀器。圖紙軟件為CAD,CAXA,PROE,UG,SolidWorks等.壓縮文件請下載最新的WinRAR軟件解壓。
  • 2. 本站的文檔不包含任何第三方提供的附件圖紙等，如果需要附件，請聯(lián)系上傳者。文件的所有權(quán)益歸上傳用戶所有。
  • 3. 本站RAR壓縮包中若帶圖紙，網(wǎng)頁內(nèi)容里面會有圖紙預(yù)覽，若沒有圖紙預(yù)覽就沒有圖紙。
  • 4. 未經(jīng)權(quán)益所有人同意不得將文件中的內(nèi)容挪作商業(yè)或盈利用途。
  • 5. 人人文庫網(wǎng)僅提供信息存儲空間，僅對用戶上傳內(nèi)容的表現(xiàn)方式做保護(hù)處理，對用戶上傳分享的文檔內(nèi)容本身不做任何修改或編輯，并不能對任何下載內(nèi)容負(fù)責(zé)。
  • 6. 下載文件中如有侵權(quán)或不適當(dāng)內(nèi)容，請與我們聯(lián)系，我們立即糾正。
  • 7. 本站不保證下載資源的準(zhǔn)確性、安全性和完整性, 同時也不承擔(dān)用戶因使用這些下載資源對自己和他人造成任何形式的傷害或損失。

評論

0/150

提交評論