第4章用HTML建立超鏈接

1、第四章第四章 用用HTML建立超鏈接建立超鏈接4.1 設(shè)置基本文字超鏈接設(shè)置基本文字超鏈接l建立HTML標(biāo)記為標(biāo)記。超鏈接最重要的兩個(gè)要素，設(shè)置為超鏈接到文本內(nèi)容和超鏈接指向的目標(biāo)地址。l基本超鏈接的結(jié)構(gòu)如下：百度鏈接標(biāo)記屬性地址鏈接文本URL的格式的格式l每個(gè)文檔在互聯(lián)網(wǎng)上有唯一的地址，該地址被稱為統(tǒng)一資源定位器（Uniform Resource Laocator）,簡(jiǎn)稱URL。lURL由四個(gè)部分組成：協(xié)議、主機(jī)名、文件夾名和文件名。 http:/ l 超鏈接l l l 點(diǎn)擊鏈接01鏈接到第1個(gè)網(wǎng)頁(yè)。l 點(diǎn)擊鏈接02鏈接到第2個(gè)網(wǎng)頁(yè)。l 點(diǎn)擊鏈接03鏈接到第3個(gè)網(wǎng)頁(yè)。l l絕對(duì)URL服務(wù)器相

2、對(duì)URL文檔相對(duì)URL絕對(duì)URL和文檔相對(duì)URL比較常用。4.2 設(shè)置頁(yè)面內(nèi)部特定目標(biāo)的鏈接設(shè)置頁(yè)面內(nèi)部特定目標(biāo)的鏈接l超鏈接不僅可以跳轉(zhuǎn)到其他頁(yè)面，也可以在本業(yè)內(nèi)跳轉(zhuǎn)。二者的跳轉(zhuǎn)目標(biāo)名稱必須要一致4.2 設(shè)置頁(yè)面內(nèi)部特定目標(biāo)的鏈接設(shè)置頁(yè)面內(nèi)部特定目標(biāo)的鏈接ll 無(wú)標(biāo)題文檔 ll第1本書 第2本書 第3本書l精通CSS+DIV網(wǎng)頁(yè)樣式與布局l本書系統(tǒng)地講解了CSS層疊樣式表的能力。l詳細(xì)介紹l CSS設(shè)計(jì)徹底研究l本書是一本深入研究和揭示CSS設(shè)計(jì)技術(shù)的書籍。本書在以然。 l 詳細(xì)介紹l CSS設(shè)計(jì)禪意花園l本書作者是世界著名的網(wǎng)站設(shè)計(jì)師，性能優(yōu)良且具有強(qiáng)大生命力的網(wǎng)站。ll4.3設(shè)置圖片的超

3、鏈接設(shè)置圖片的超鏈接ll l 圖片的超鏈接l l l l l4.3設(shè)置圖片的超鏈接設(shè)置圖片的超鏈接l為圖片添加一個(gè)超鏈接后，瀏覽器就會(huì)自動(dòng)給圖片加上一個(gè)粗邊框，就像在建立文字超鏈接時(shí)會(huì)加上下劃線一樣。如果希望去掉這個(gè)邊框，只需要在標(biāo)記中設(shè)置border=“1”后就可以取消這個(gè)邊框。l 4.4 設(shè)置電子郵件鏈接設(shè)置電子郵件鏈接l電子郵件鏈接類似于URL的鏈接方式，格式是mailto:電子郵件地址。ll l 郵件的鏈接l l l 聯(lián)系我們：給我們發(fā)送郵件。l l4.5 設(shè)置以新窗口顯示鏈接頁(yè)面設(shè)置以新窗口顯示鏈接頁(yè)面l如果要在點(diǎn)擊某個(gè)鏈接以后，打開一個(gè)新的瀏覽器窗口，在這個(gè)新窗口里顯示目標(biāo)頁(yè)面，就

4、需要在標(biāo)記中設(shè)置”target” 屬性。lTarget屬性設(shè)置為“_blank”，就會(huì)自動(dòng)打開一個(gè)新窗口，顯示目標(biāo)頁(yè)面。4.5 設(shè)置以新窗口顯示鏈接頁(yè)面設(shè)置以新窗口顯示鏈接頁(yè)面lll以新窗口方式打開ll以新窗口方式打開一個(gè)頁(yè)面。ll4.6 創(chuàng)建熱點(diǎn)區(qū)域創(chuàng)建熱點(diǎn)區(qū)域l所謂圖片的熱點(diǎn)區(qū)域就是將一個(gè)圖片劃分成若干個(gè)鏈接區(qū)域。訪問者點(diǎn)擊不同區(qū)域會(huì)鏈接到不同的目標(biāo)頁(yè)面。lHTML中可以使用3種類型的熱點(diǎn)區(qū)域：矩形、圓形和多邊形。4.6 創(chuàng)建熱點(diǎn)區(qū)域創(chuàng)建熱點(diǎn)區(qū)域lll l 矩形左上右下鏈接地址4.6 創(chuàng)建熱點(diǎn)區(qū)域創(chuàng)建熱點(diǎn)區(qū)域ll l左上半徑各點(diǎn)坐標(biāo)4.6 創(chuàng)建熱點(diǎn)區(qū)域創(chuàng)建熱點(diǎn)區(qū)域l在設(shè)計(jì)窗口中定位熱點(diǎn)區(qū)域

5、：4.6 創(chuàng)建熱點(diǎn)區(qū)域創(chuàng)建熱點(diǎn)區(qū)域l1、創(chuàng)建新文檔，插入圖片。l2、在屬性面板中選擇要?jiǎng)?chuàng)建的熱點(diǎn)類型（矩形、圓形、多邊形）l3、畫區(qū)域l4、指針熱點(diǎn)進(jìn)行調(diào)整l5、輸入跳轉(zhuǎn)的目標(biāo)頁(yè)面l6、選擇跳轉(zhuǎn)方式4.7 框架之間的鏈接框架之間的鏈接l框架是一種常用網(wǎng)頁(yè)布局工具。它的作用是把瀏覽器的顯示空間劃分為幾個(gè)部分，每個(gè)部分都可以獨(dú)立顯示不同的頁(yè)面。建立框架與框架集（建立框架與框架集（ ）l和 標(biāo)記是與和同級(jí)的，因此，不要將和標(biāo)記包含在標(biāo)記中，否則標(biāo)記將無(wú)法正常使用。用用cols屬性將窗口分為左右兩部分屬性將窗口分為左右兩部分l窗口框架的分割方式有兩種，一種是水平分割，另一種是垂直分割。在標(biāo)記中的col

6、s屬性和rows屬性用來(lái)控制窗口的分割方式。lCols屬性可以將一個(gè)框架集分割為若干列，其中語(yǔ)法結(jié)構(gòu)是：N1表示窗口1的的寬度，以像素或百分比為單位*表示分配給前面所有窗口后剩下的寬度。比如,那么星號(hào)就代表50%用用rows屬性將窗口分為上中下三部分屬性將窗口分為上中下三部分lllllll框架的嵌套框架的嵌套lRows屬性和cols屬性也可以混合起來(lái)使用，實(shí)現(xiàn)框架的嵌套。llllllllll用用src屬性在框架中插入網(wǎng)頁(yè)屬性在框架中插入網(wǎng)頁(yè)l其語(yǔ)法結(jié)構(gòu)如下：llllllll用用src屬性在框架之間鏈接（屬性在框架之間鏈接（P63）lTarget的四種屬性：l_blank:表示新打開一個(gè)瀏覽器窗

7、口，在其中顯示鏈接的目標(biāo)頁(yè)面。l_self:相當(dāng)于不設(shè)置target屬性，窗口中顯示鏈接的目標(biāo)頁(yè)面。l_top:表示在頂級(jí)框架，也就是在瀏覽器窗口中顯示鏈接的目標(biāo)頁(yè)面。l_partent：表示在上一級(jí)框架中顯示鏈接的目標(biāo)頁(yè)面。創(chuàng)建嵌入式框架創(chuàng)建嵌入式框架l也稱為“浮動(dòng)框架”，可以自由控制窗口的大小。在使用的時(shí)候不需要?jiǎng)?chuàng)建框架集，直接插入即可。4.8 鏈接增多后網(wǎng)站的組織結(jié)構(gòu)與維護(hù)鏈接增多后網(wǎng)站的組織結(jié)構(gòu)與維護(hù)l通常在開發(fā)網(wǎng)站的時(shí)候，并不是把所有的網(wǎng)頁(yè)文件都保存在一個(gè)站點(diǎn)根目錄下，而是使用不同的文件夾存放不同性質(zhì)的文件。l建立起合適的網(wǎng)站文件存儲(chǔ)結(jié)果，能迅速定位自己需要的文件，或者將制作完成的文件存儲(chǔ)到相應(yīng)的目錄中，進(jìn)行網(wǎng)站的開發(fā)工作。4.8 鏈接增多后網(wǎng)站的組織結(jié)構(gòu)與維護(hù)鏈接增多后網(wǎng)站的組織結(jié)構(gòu)與維護(hù)l方案一l將不同類型的文件存放在不同的文件夾中，這種存儲(chǔ)方法使用于中小型的網(wǎng)站，該方法是用過文件的類型對(duì)文件進(jìn)行管理。l例如：將圖片文件都放在Pic文件夾中，將聲音文件都放在sounds文件夾中。方案二方案二l按照主題對(duì)文件進(jìn)行分類管理。在這種存儲(chǔ)方案中，網(wǎng)站的頁(yè)面按照不同的主題進(jìn)行分類存儲(chǔ)。關(guān)于某個(gè)主題的所有文件被存放在一個(gè)文件夾中，然后再進(jìn)一步細(xì)分文件的類型。這種存儲(chǔ)