HTML中使用&lt;a&gt;標(biāo)簽實(shí)現(xiàn)文本內(nèi)鏈接-零基礎(chǔ)自學(xué)網(wǎng)頁制作

本內(nèi)鏈接

最后這些關(guān)于html的內(nèi)容有點(diǎn)查漏補(bǔ)缺的意思了，這一次是關(guān)于文本內(nèi)鏈接的使用方法，簡單來說就是我們的頁面中有一個章節(jié)名稱目錄，如何點(diǎn)擊目錄中的名稱，就能正好在頁面中顯示相應(yīng)內(nèi)容。

如圖所示：

點(diǎn)擊目錄的"總體評價"跳轉(zhuǎn)到相應(yīng)內(nèi)容，如圖：

就是這樣的一個效果。在很多網(wǎng)頁中經(jīng)常看到。

這個案例我們會分三部分來講解。

今天主要學(xué)習(xí)如何使用<a>標(biāo)簽進(jìn)行頁面內(nèi)鏈接，已及從其他網(wǎng)頁鏈接該頁面內(nèi)的指定內(nèi)容。

這里會有一個問題，就是點(diǎn)擊鏈接后，文字內(nèi)容會置頂顯示，這個默認(rèn)形式會給我們帶來不便，解決方案較復(fù)雜，會在最后一次講解中給出。

下一次我們來學(xué)習(xí)如何對圖片添加映射超鏈接，映射超鏈接的意思是，假如我的圖片中有兩個人物或物象，考慮讀者會感興趣，想了解更多內(nèi)容，如何框選出物象邊緣來添加鏈接，這就是圖像映射超鏈接。如圖：使用一個平時不可見的邊框來制作圖片映射鏈接，確保感興趣的讀者能點(diǎn)擊到畫面中的目標(biāo)物體。

最后一部分我們將回答今天結(jié)尾的問題，也就是如何解決置頂問題。這一部分也會作為HTML部分結(jié)束的綜合練習(xí)，和css部分啟蒙的預(yù)熱練習(xí)。，

首先看一下今天的基礎(chǔ)代碼

<!DOCTYPE HTML>
  <html>
  <head> 
  <title>文內(nèi)鏈接</title>
  </head> 
  <body >
  <a>試飛進(jìn)程</a>
  <a>研制情況</a>
  <a>服役動態(tài)</a>
  <a>總體評價</a>
  <p>
  <h2><a>試飛進(jìn)程</a></h2>
  殲-20隱形戰(zhàn)斗機(jī)首架技術(shù)驗證機(jī)于2011年1月11日中午12時50分左右進(jìn)行首次升空飛行測試，13時08分成功著陸，歷時18分鐘。<br>整個首飛過程在殲-10S戰(zhàn)斗教練機(jī)陪伴下完成 。2016年10月28日，首次發(fā)布"空軍試飛員將駕殲-20飛機(jī)亮相中國航展"后，還陸續(xù)發(fā)布了"殲-20戰(zhàn)機(jī)列裝空軍作戰(zhàn)部隊""空軍殲-20戰(zhàn)機(jī)首次開展海上方向?qū)崙?zhàn)化訓(xùn)練"等。
  <h2><a>研制情況</a></h2>
  在2016年11月1日，第十一屆珠海航展，殲-20首次進(jìn)行空中飛行展示。兩架殲-20做了公開飛行，不僅在現(xiàn)場引起轟動，也立刻被西方媒體大量報道。殲-20是中國現(xiàn)代空中力量的代表作，也進(jìn)入了世界最先進(jìn)的第五代戰(zhàn)斗機(jī)行列，它是中國國防能力高速發(fā)展的一個象征。<br>2018年11月11日，第十二屆中國航展在珠海迎來"高光時刻"：殲-20戰(zhàn)機(jī)在公開飛行展示中掛彈開倉，震撼獻(xiàn)禮人民空軍成立69周年紀(jì)念日。 <br>2019年10月13日，慶祝人民空軍成立70周年航空開放活動新聞發(fā)布上，空軍新聞發(fā)言人申進(jìn)科大校介紹殲-20戰(zhàn)機(jī)列陣人民空軍"王牌部隊"
  <h2><a>服役動態(tài)</a></h2>
  2017年3月9日，中央電視臺報道殲-20戰(zhàn)斗機(jī)正式進(jìn)入空軍序列。<br>2017年3月13日，《中國日報》發(fā)布消息稱，中國自主研制的殲-20近期將裝配國產(chǎn)發(fā)動機(jī)。<br>2017年7月30日，殲-20三機(jī)編隊參加在朱日和舉行的慶祝中國人民解放軍成立90周年閱兵。殲擊機(jī)梯隊飛來，3架殲-20隱形戰(zhàn)斗機(jī)以楔形編隊的形式在天空中飛過。<br>2017年9月28日，在中國國防部行記者會上，國防部新聞發(fā)言人吳謙大校介紹殲-20飛機(jī)已經(jīng)列裝部隊。<br>2017年11月10日上午，中國空軍發(fā)言人申進(jìn)科大校表示，殲-20 列裝部隊后，已經(jīng)開展編隊訓(xùn)練。<br>2018年2月9日，中國空軍新聞發(fā)言人申進(jìn)科大校發(fā)布消息，殲-20開始列裝空軍作戰(zhàn)部隊。<br>2018年10月30日，中國空軍4架殲-20隱形戰(zhàn)斗機(jī)現(xiàn)身珠海金灣機(jī)場上空。<br>2019年10月1日，殲-20現(xiàn)身慶祝中華人民共和國成立70周年閱兵式；閱兵中，殲-20與殲-16、殲-10C三型飛機(jī)分別以5機(jī)楔隊組成戰(zhàn)斗隊形接受檢閱；該三款殲擊機(jī)被譽(yù)為中國空軍殲擊機(jī)家族的"三劍客"，是未來聯(lián)合作戰(zhàn)的骨干力量
  <h2><a>總體評價</a></h2>
  殲-20是眼下亞洲區(qū)域最先進(jìn)的戰(zhàn)機(jī)，這讓中國空軍在面對日本、韓國與印度等國家的空軍時占有顯著優(yōu)勢。外媒將殲-20與其他國家戰(zhàn)機(jī)進(jìn)行了對比。俄羅斯蘇霍伊蘇-57戰(zhàn)斗機(jī)由于研制進(jìn)度幾度推遲，尚未正式交付入役；美國F-35戰(zhàn)斗機(jī)也多次出現(xiàn)飛機(jī)供氧不足的問題，大面積停飛，出口受阻；韓國KF-X隱形戰(zhàn)機(jī)先是被爆出因掌握不了關(guān)鍵技術(shù)而被迫降成四代半戰(zhàn)機(jī)的情況，后又傳出了合作方印尼打算撤資并已告知韓國的消息。因此，中國殲-20戰(zhàn)機(jī)成為亞太區(qū)域領(lǐng)跑的優(yōu)勢戰(zhàn)機(jī)。<br>中國空軍正向全疆域作戰(zhàn)的現(xiàn)代化戰(zhàn)略性軍種邁進(jìn)，成為有效塑造態(tài)勢、管控危機(jī)、遏制戰(zhàn)爭、打贏戰(zhàn)爭的重要力量。殲-20戰(zhàn)機(jī)列裝空軍作戰(zhàn)部隊，將進(jìn)一步提升空軍綜合作戰(zhàn)能力，有助于空軍更好的肩負(fù)起維護(hù)國家主權(quán)、安全和領(lǐng)土完整的神圣使命。<br>殲20是我國自主研制的第五代戰(zhàn)斗機(jī)，它的研制實(shí)現(xiàn)了既定的四大目標(biāo)——打造跨代新機(jī)、引領(lǐng)技術(shù)發(fā)展、創(chuàng)新研發(fā)體系、建設(shè)卓越團(tuán)隊。打造跨代新機(jī)，是按照性能、技術(shù)和進(jìn)度要求，研制開發(fā)我國自己的新一代隱身戰(zhàn)斗機(jī)。引領(lǐng)技術(shù)發(fā)展，指通過自主創(chuàng)新實(shí)現(xiàn)強(qiáng)軍興軍的目標(biāo)。殲20在態(tài)勢感知、信息對抗、協(xié)同作戰(zhàn)等多方面取得了突破，這是中國航空工業(yè)從跟跑到并跑，再到領(lǐng)跑的必由之路。創(chuàng)新研發(fā)體系，是指建設(shè)最先進(jìn)的飛機(jī)研制條件和研制流程。通過一大批大國重器的研制，我們建立了具有我國特色的數(shù)字化研發(fā)體系。建設(shè)卓越團(tuán)隊，是指通過型號研制，錘煉一支愛黨愛國的研制隊伍，這些擁有報國情懷、創(chuàng)新精神的優(yōu)秀青年是航空事業(yè)未來發(fā)展的生力軍。未來，我們將在戰(zhàn)斗機(jī)的機(jī)械化、信息化、智能化發(fā)展征程上不斷前行。
  </p>
  </body> 
  </html>

看著復(fù)雜，實(shí)際上主要都是些內(nèi)容文字，簡化后的代碼如下：

<!DOCTYPE HTML>
  <html>
  <head> 
  <title>文內(nèi)鏈接</title>
  </head> 
  <body >
  <a>試飛進(jìn)程</a>
  <a>研制情況</a>
  <a>服役動態(tài)</a>
  <a>總體評價</a>
  <p>
  <h2><a>試飛進(jìn)程</a></h2>
    殲-20隱形........首次開展海上方向?qū)崙?zhàn)化訓(xùn)練"等。
  <h2><a>研制情況</a></h2>
    在2016年......"王牌部隊"
  <h2><a>服役動態(tài)</a></h2>
    2骨干力量
  <h2><a>總體評價</a></h2>
    殲-20是眼下亞洲區(qū)域最先進(jìn)的戰(zhàn)機(jī)......不斷前行。
  </p>
  </body> 
  </html>

就是在<body></body>中添加四個<a></a>標(biāo)簽來寫入標(biāo)題，并列寫入一個<p></p>標(biāo)簽，并在<p></p>標(biāo)簽中添加文字內(nèi)容和<h2></h2>標(biāo)簽。這時需要注意的是，<h2></h2>中還要用<a></a>標(biāo)簽夾住標(biāo)題。

頁面效果如下：

下面我們來添加文章內(nèi)部鏈接

添加文章內(nèi)部鏈接需要一前一后兩個<a></a>標(biāo)簽。一個是目錄中的<a></a>,如圖：

一個是正文中的標(biāo)題上的<a></a>,如圖：

添加內(nèi)部鏈接的辦法非常簡單，首先我們把目錄中的標(biāo)題<a></a>標(biāo)簽稱為"召喚者"。把正文中的標(biāo)題中的<a></a>標(biāo)簽稱為"被召喚者"。如果您學(xué)過《》這篇教程就會知道，一個標(biāo)簽召喚或調(diào)用另一個標(biāo)簽需要能叫出被調(diào)用標(biāo)簽的名字！

所以先要給"被召喚者"起名字，起名字的方法有兩種，一種是name=""，還有一種是id=""，建議大家都寫上，因為有的瀏覽器不支持name屬性。具體寫法如下：

<h2><a name="chapter1" id="chapter1">試飛進(jìn)程</a></h2>

在"召喚者"<a>標(biāo)簽中使用href屬性來叫出"被召喚者"的名字！示例代碼如下：需要在引號中添加#后再寫名字。

<!DOCTYPE HTML>
  <html>
  <head> 
  <title>文內(nèi)鏈接</title>
  </head> 
  <body >
  <a href="#chapter1">試飛進(jìn)程</a><!--看這里-->
  <a>研制情況</a>
  <a>服役動態(tài)</a>
  <a>總體評價</a>
  </body> 
  </html>

<a>標(biāo)簽有點(diǎn)懶，只叫名字的話它會假裝聽不見，所以還要具體描述它的特征，讓它不好意思偷懶，也就是前后兩個<a></a>標(biāo)簽中間夾的文字內(nèi)容要一致，比如上文中的兩個<a>中間的內(nèi)容都是"試飛進(jìn)程"。如果字不一樣，休想叫得動"被召喚者"。

效果如下：

點(diǎn)擊后，試飛進(jìn)程標(biāo)簽跳到了視窗的最頂端，如圖：這種頂在視窗頂端的顯示的方式我們稱之為"置頂"。

下面我們使用這個方法，為剩下的標(biāo)題添加頁面內(nèi)鏈接。

打開外部頁面中指定信息位置的方法

首先，我們復(fù)制一下這個頁面文件命名為"打開外部頁面文件指定位置.html"，然后刪掉<p></p>和其中內(nèi)容。示例代碼如下：

<!DOCTYPE HTML>
  <html>
  <head> 
  <title>打開外部頁面文件指定位置</title>
  </head> 
  <body >
  <a href="#chapter1">試飛進(jìn)程</a>
  <a href="#chapter2">研制情況</a>
  <a href="#chapter3">服役動態(tài)</a>
  <a href="#chapter4">總體評價</a>
  </body> 
  </html>

方法非常簡單，在href中添加外部頁面路徑即可！示例代碼如下：

<a href="文內(nèi)鏈接ceshi.html#chapter1">試飛進(jìn)程</a>

依次添加后，頁面效果如下：

點(diǎn)擊其中一個標(biāo)題"研制情況"，頁面跳轉(zhuǎn)，如圖：

這里，置頂?shù)膯栴}就出現(xiàn)了，如果我們的文章目錄一直在視圖的頂部，每次點(diǎn)擊頁面內(nèi)鏈接時，頂部的目錄就會和標(biāo)題重疊，非常不美觀，解決這個問題就要涉及到<div>布局的應(yīng)用，我們以后再說。

OK！今天我們的內(nèi)容結(jié)束了，下一次學(xué)習(xí)圖片映射鏈接功能。

喜歡的朋友請關(guān)注我，點(diǎn)贊也會讓我動力滿滿。

HTML完整學(xué)習(xí)目錄

HTML序章（學(xué)習(xí)目的、對象、基本概念）——零基礎(chǔ)自學(xué)網(wǎng)頁制作

HTML是什么？——零基礎(chǔ)自學(xué)網(wǎng)頁制作

第一個HTML頁面如何寫？——零基礎(chǔ)自學(xué)網(wǎng)頁制作

HTML頁面中head標(biāo)簽有啥用？——零基礎(chǔ)自學(xué)網(wǎng)頁制作

初識meta標(biāo)簽與SEO——零基礎(chǔ)自學(xué)網(wǎng)頁制作

HTML中的元素使用方法1——零基礎(chǔ)自學(xué)網(wǎng)頁制作

HTML中的元素使用方法2——零基礎(chǔ)自學(xué)網(wǎng)頁制作

HTML元素中的屬性1——零基礎(chǔ)自學(xué)網(wǎng)頁制作

HTML元素中的屬性2（路徑詳解）——零基礎(chǔ)自學(xué)網(wǎng)頁制作

使用HTML添加表格1（基本元素）——零基礎(chǔ)自學(xué)網(wǎng)頁制作

使用HTML添加表格2（表格頭部與腳部）——零基礎(chǔ)自學(xué)網(wǎng)頁制作

使用HTML添加表格3（間距與顏色）——零基礎(chǔ)自學(xué)網(wǎng)頁制作

使用HTML添加表格4（行顏色與表格嵌套）——零基礎(chǔ)自學(xué)網(wǎng)頁制作

16進(jìn)制顏色表示與RGB色彩模型——零基礎(chǔ)自學(xué)網(wǎng)頁制作

HTML中的塊級元素與內(nèi)聯(lián)元素——零基礎(chǔ)自學(xué)網(wǎng)頁制作

初識HTML中的<div>塊元素——零基礎(chǔ)自學(xué)網(wǎng)頁制作

在HTML頁面中嵌入其他頁面的方法——零基礎(chǔ)自學(xué)網(wǎng)頁制作

封閉在家學(xué)網(wǎng)頁制作！為頁面嵌入PDF文件——零基礎(chǔ)自學(xué)網(wǎng)頁制作

HTML表單元素初識1——零基礎(chǔ)自學(xué)網(wǎng)頁制作

HTML表單元素初識2——零基礎(chǔ)自學(xué)網(wǎng)頁制作

HTML表單3（下拉列表、多行文字輸入）——零基礎(chǔ)自學(xué)網(wǎng)頁制作

HTML表單4（form的action、method屬性）——零基礎(chǔ)自學(xué)網(wǎng)頁制作

HTML列表制作講解——零基礎(chǔ)自學(xué)網(wǎng)頁制作

為HTML頁面添加視頻、音頻的方法——零基礎(chǔ)自學(xué)網(wǎng)頁制作

音視頻格式轉(zhuǎn)換神器與html視頻元素加字幕——零基礎(chǔ)自學(xué)網(wǎng)頁制作

HTML中使用<a>標(biāo)簽實(shí)現(xiàn)文本內(nèi)鏈接——零基礎(chǔ)自學(xué)網(wǎng)頁制作

TML實(shí)現(xiàn)文件夾的上傳和下載，前端如何用HTML5實(shí)現(xiàn)分片上傳GB級大文件，網(wǎng)頁中實(shí)現(xiàn)文件上傳下載的三種解決方案(推薦)，HTML5實(shí)現(xiàn)文件批量上傳組件，JQUERY 實(shí)現(xiàn)文件夾上傳(保留目錄結(jié)構(gòu))，B/S大文件上傳支持?jǐn)帱c(diǎn)上傳，WebService 大文件上傳,斷點(diǎn)續(xù)傳分片，HTML+AJAX實(shí)現(xiàn)上傳大文件問題，用HTML實(shí)現(xiàn)本地文件的上傳，HTML5實(shí)現(xiàn)大文件上傳，HTML5實(shí)現(xiàn)大文件分片上傳思路，利用HTML5分片上傳超大文件思路，

WEBUPLOADER 支持超大上G,多附件上傳，JS 大文件分割/分片上傳，

百度WEBUPLOADER上傳視頻等大文件，WEBUPLOAD組件實(shí)現(xiàn)文件上傳功能和下載功能，JS大文件切片上傳，斷點(diǎn)續(xù)傳實(shí)現(xiàn)DEMO，前端上傳大文件的解決方案，前端上傳大文件處理（切片、斷點(diǎn)續(xù)傳），前端大文件上傳優(yōu)化方案——分片上傳，vue大文件上傳解決方案，vue大文件上傳解決方案10G，vue大文件上傳解決方案50G，vue大文件上傳解決方案100G，html5如何實(shí)現(xiàn)大文件斷點(diǎn)續(xù)傳、秒傳，

java如何實(shí)現(xiàn)大文件斷點(diǎn)續(xù)傳、秒傳，SpringBoot如何實(shí)現(xiàn)大文件斷點(diǎn)續(xù)傳、秒傳，SpringMVC如何實(shí)現(xiàn)大文件斷點(diǎn)續(xù)傳、秒傳，SpringCloud如何實(shí)現(xiàn)大文件斷點(diǎn)續(xù)傳、秒傳，

webuploader如何實(shí)現(xiàn)大文件斷點(diǎn)續(xù)傳、秒傳，百度webuploader如何實(shí)現(xiàn)大文件斷點(diǎn)續(xù)傳、秒傳，html5實(shí)現(xiàn)大文件斷點(diǎn)續(xù)傳、秒傳，vue如何實(shí)現(xiàn)大文件斷點(diǎn)續(xù)傳、秒傳，前端如何實(shí)現(xiàn)大文件斷點(diǎn)續(xù)傳、秒傳，JavaScript如何實(shí)現(xiàn)大文件斷點(diǎn)續(xù)傳、秒傳，

html5大文件斷點(diǎn)續(xù)傳、秒傳解決方案，html5大文件斷點(diǎn)續(xù)傳、加密上傳解決方案，html5大文件斷點(diǎn)續(xù)傳、加密存儲解決方案，html5大文件斷點(diǎn)續(xù)傳分片解決方案，html5大文件斷點(diǎn)續(xù)傳分塊解決方案，html5大文件斷點(diǎn)續(xù)傳分割解決方案，html5大文件斷點(diǎn)續(xù)傳切割解決方案，

后端我們公司項目組選的是JAVA，因為公司有自己的產(chǎn)品，所以直接使用就行了，針對客戶需求這塊是進(jìn)行擴(kuò)展。

客戶這邊實(shí)際上要傳的文件單個大小就有50G左右，所以需要支持?jǐn)帱c(diǎn)續(xù)傳和分片上傳，并且要支持多線程上傳，能夠充分利用帶寬資源。

之前在網(wǎng)上找過相關(guān)的資料，論壇里面也有網(wǎng)友交流過，還加過很多QQ群和微信群，但是結(jié)果都不太令人滿意。

技術(shù)選型的話用的是jquery，也是一個企業(yè)內(nèi)網(wǎng)系統(tǒng)，用的是之前公司的框架，只是進(jìn)行功能擴(kuò)展

分片網(wǎng)上討論的很多，基本上全部都是用的HTML5的API，這個方案也不是不能用，但是在IE下面就不行了，兼容性差了點(diǎn)，并且也不能進(jìn)行擴(kuò)展，不能進(jìn)行二次開發(fā)，限制性非常大，我們技術(shù)同事提的要求是需要提供產(chǎn)品完整源代碼，

網(wǎng)上的文章全部都沒有提供文件夾上傳和續(xù)傳的代碼，也沒有提供數(shù)據(jù)庫操作的代碼，

另外這塊我們是要求必須提供產(chǎn)品完整源代碼，因為后面我們需要自已來維護(hù)，同時是要求能夠自主可控的

研發(fā)部門的同事調(diào)研過百度的webuploader這個組件，發(fā)現(xiàn)他實(shí)際上就是對Flash和HTML5進(jìn)行了一個封裝，本質(zhì)還是調(diào)的HTML5的API，之前在項目中也用過，嘗試過，但是最終都不太滿意，一個是兼容性非常差，說的是兼容IE，但是在IE用的是Flash，在很多用戶的電腦上用不了，卡頓崩潰發(fā)生的太頻繁，文件上傳的數(shù)量一多比如幾千個，前端頁面就開始卡了，用戶體驗非常差。這些問題研發(fā)部的同事都向百度反應(yīng)過，但是百度webuploader那邊一直沒人回，基本上沒人管，領(lǐng)導(dǎo)說要求付費(fèi)提供技術(shù)支持，那邊也是沒人回，聯(lián)系不上他們?nèi)魏稳恕?/p>

webuploader這邊連個開發(fā)人員都聯(lián)系不到，這個是怎么回事？

用戶上傳的文件比較大，有20G左右，直接用HTML傳的話容易失敗，服務(wù)器也容易出錯，需要分片，分塊，分割上傳。也就是將一個大的文件分成若干個小文件塊來上傳，另外就是需要實(shí)現(xiàn)秒傳功能和防重復(fù)功能，秒傳就是用戶如果上傳過這個文件，那么直接在數(shù)據(jù)庫中查找記錄就行了，不用再上傳一次，節(jié)省時間，實(shí)現(xiàn)的思路是對文件做MD5計算，將MD5值保存到數(shù)據(jù)庫，算法可以用MD5，或者CRC，或者SHA1，這個隨便哪個算法都行。

切片的話還有一點(diǎn)就是在服務(wù)器上合并，一個文件的所有分片數(shù)據(jù)上傳完后需要在服務(wù)器端進(jìn)行合并操作。

視頻教程：https://www.ixigua.com/7227314770696012322

導(dǎo)入項目：
導(dǎo)入到Eclipse：http://www.ncmem.com/doc/view.aspx?id=9da9c7c2b91b40b7b09768eeb282e647
導(dǎo)入到IDEA：http://www.ncmem.com/doc/view.aspx?id=9fee385dfc0742448b56679420f22162
springboot統(tǒng)一配置：http://www.ncmem.com/doc/view.aspx?id=7768eec9284b48e3abe08f032f554ea2

下載示例：

https://gitee.com/xproer/up6-jsp-eclipse/tree/6.5.40/

工程

NOSQL

NOSQL示例不需要任何配置，可以直接訪問測試

創(chuàng)建數(shù)據(jù)表

選擇對應(yīng)的數(shù)據(jù)表腳本，這里以SQL為例

修改數(shù)據(jù)庫連接信息

訪問頁面進(jìn)行測試

文件存儲路徑

up6/upload/年/月/日/guid/filename

相關(guān)問題：
1.javax.servlet.http.HttpServlet錯誤
2.項目無法發(fā)布到tomcat
3.md5計算完畢后卡住
4.服務(wù)器找不到config.json文件

相關(guān)參考：

文件保存位置

源碼工程文檔：https://drive.weixin.qq.com/s?k=ACoAYgezAAw1dWofra

源碼報價單：https://drive.weixin.qq.com/s?k=ACoAYgezAAwoiul8gl

OEM版報價單：https://drive.weixin.qq.com/s?k=ACoAYgezAAwuzp4W0a

產(chǎn)品源代碼：https://drive.weixin.qq.com/s?k=ACoAYgezAAwbdKCskc
授權(quán)生成器：https://drive.weixin.qq.com/s?k=ACoAYgezAAwTIcFph1

徑描述

<img src="picture.jpg">

picture.jpg 位于與當(dāng)前網(wǎng)頁相同的文件夾

<img src="images/picture.jpg">

picture.jpg 位于當(dāng)前文件夾的 images 文件夾中

<img src="/images/picture.jpg">

picture.jpg 當(dāng)前站點(diǎn)根目錄的 images 文件夾中

<img src="../picture.jpg">

picture.jpg 位于當(dāng)前文件夾的上一級文件夾中

HTML 文件路徑

文件路徑描述了網(wǎng)站文件夾結(jié)構(gòu)中某個文件的位置。

文件路徑會在鏈接外部文件時被用到：

網(wǎng)頁
圖像
樣式表
JavaScript

絕對文件路徑

絕對文件路徑是指向一個因特網(wǎng)文件的完整 URL：

實(shí)例

在線咨詢

上一篇：滬科版小學(xué)書法三年級上冊《第6課豎》優(yōu)質(zhì)課教案
下一篇：html5聊天實(shí)例｜h5+jquery仿微信界面聊天｜朋友圈模板

您的項目需求

*請認(rèn)真填寫需求信息，我們會在24小時內(nèi)與您取得聯(lián)系。

整合營銷服務(wù)商

HTML中使用&amp;lt;a&amp;gt;標(biāo)簽實(shí)現(xiàn)文本內(nèi)鏈接-零基礎(chǔ)自學(xué)網(wǎng)頁制作

本內(nèi)鏈接

HTML完整學(xué)習(xí)目錄

HTML 文件路徑

絕對文件路徑

您的項目需求

HTML中使用<a>標(biāo)簽實(shí)現(xiàn)文本內(nèi)鏈接-零基礎(chǔ)自學(xué)網(wǎng)頁制作