搜尋
首頁web前端html教學HTML img標籤的絕對路徑怎麼寫? HTML img標籤絕對路徑的使用方法

這篇文章主要講述了HTML中的img標籤的絕對路徑的寫法和使用的方法詳解,有興趣的朋友可以一起來看看,有問題可以在下方提問區進行提問。

首先我們先了解什麼是絕對路徑:

就是你的主頁上的檔案或目錄在硬碟上真正的路徑

我們先來看看這個實例:

<!-- 当图片位置和源代码的父文件夹位置在同一父文件夹时候 应先返回父级文件夹../ 因此src地址填"..\images/baby.jpg" -->
<img src="/static/imghwm/default1.png"  data-src="../images/baby.jpg"  class="lazy"   alt="1111" >
<!-- 当图片位置和源代码的位置在同一个文件夹时,可以直接访问。(alt属性的值是表示图片加载不出来时显示1111,不填不要紧) -->
<img src="/static/imghwm/default1.png"  data-src="baby.jpg"  class="lazy"   alt="111">
<!-- 下面用绝对路径,我把图片放在桌面上 -->
<img src="/static/imghwm/default1.png"  data-src="C:\Users\Air\Desktop\baby.jpg"  class="lazy"   alt="">

HTML img標籤的絕對路徑怎麼寫? HTML img標籤絕對路徑的使用方法

用絕對路徑,把照片放到網頁上顯示。

資料上說:考慮伺服器的安全性, HTML裡用的是相對路徑,也就是用網頁伺服器的root資料夾為起始,而不允許進入與root平行的或高於網頁伺服器root的其它分支路徑。其實,靜態頁面是能寫出絕對路徑的。

資料庫中存放的是圖片的位址,存放的方法是:this.getServletContext().getRealPath("/WEB-INF/cImage") 加上 圖片的名字作為地址。

例如: src="http://網點網站字串/根路徑的圖片檔名「

這個圖片在root.接著用斜杠,一段一段寫路徑就可以了。

另一個方法是用 標籤,在href裡面定下本網頁內容的預設路徑。 img裡直接寫圖片檔名就可以了。

絕對路徑,外網絕對路徑:

<img src="/static/imghwm/default1.png"  data-src="http://phpyun.ke.163.com/http://www.PHP.cn/i/eg_tulip.jpg"  class="lazy"   alt="小编" />

這篇文章到這就結束了,如果有問題,歡迎在下方提問。

【小編推薦】

HTML中head標籤是什麼意思?一篇文章教你正確使用head標籤

駭客應該學PHP還是python?理性分析PHP和python的十處差異

#

以上是HTML img標籤的絕對路徑怎麼寫? HTML img標籤絕對路徑的使用方法的詳細內容。更多資訊請關注PHP中文網其他相關文章!

陳述
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
HTML標籤和HTML屬性有什麼區別?HTML標籤和HTML屬性有什麼區別?May 14, 2025 am 12:01 AM

HTMLtagsdefinethestructureofawebpage,whileattributesaddfunctionalityanddetails.1)Tagslike,,andoutlinethecontent'splacement.2)Attributessuchassrc,class,andstyleenhancetagsbyspecifyingimagesources,styling,andmore,improvingfunctionalityandappearance.

HTML的未來:進化和趨勢HTML的未來:進化和趨勢May 13, 2025 am 12:01 AM

HTML的未來將朝著更加語義化、功能化和模塊化的方向發展。 1)語義化將使標籤更明確地描述內容,提升SEO和無障礙訪問。 2)功能化將引入新元素和屬性,滿足用戶需求。 3)模塊化將支持組件化開發,提高代碼復用性。

為什麼HTML屬性對Web開發很重要?為什麼HTML屬性對Web開發很重要?May 12, 2025 am 12:01 AM

htmlattributesarecrucialinwebdevelopment forcontrollingBehavior,外觀和功能

Alt屬性的目的是什麼?為什麼重要?Alt屬性的目的是什麼?為什麼重要?May 11, 2025 am 12:01 AM

alt屬性是HTML中標籤的重要部分,用於提供圖片的替代文本。 1.當圖片無法加載時,alt屬性中的文本會顯示,提升用戶體驗。 2.屏幕閱讀器使用alt屬性幫助視障用戶理解圖片內容。 3.搜索引擎索引alt屬性中的文本,提高網頁的SEO排名。

HTML,CSS和JavaScript:示例和實際應用HTML,CSS和JavaScript:示例和實際應用May 09, 2025 am 12:01 AM

HTML、CSS和JavaScript在網頁開發中的作用分別是:1.HTML用於構建網頁結構;2.CSS用於美化網頁外觀;3.JavaScript用於實現動態交互。通過標籤、樣式和腳本,這三者共同構築了現代網頁的核心功能。

如何在標籤上設置lang屬性?為什麼這很重要?如何在標籤上設置lang屬性?為什麼這很重要?May 08, 2025 am 12:03 AM

設置標籤的lang屬性是優化網頁可訪問性和SEO的關鍵步驟。 1)在標籤中設置lang屬性,如。 2)在多語言內容中,為不同語言部分設置lang屬性,如。 3)使用符合ISO639-1標準的語言代碼,如"en"、"fr"、"zh"等。正確設置lang屬性可以提高網頁的可訪問性和搜索引擎排名。

HTML屬性的目的是什麼?HTML屬性的目的是什麼?May 07, 2025 am 12:01 AM

htmlattributeseresene forenhancingwebelements'functionalityandAppearance.TheyAdDinformationTodeFineBehavior,外觀和互動,使網站互動,響應式,visalalyAppealing.AttributesLikutesLikeSlikEslikesrc,href,href,href,類,類型,類型,和dissabledtransfransformformformformformformformformformformformformformformforment

您如何在HTML中創建列表?您如何在HTML中創建列表?May 06, 2025 am 12:01 AM

toCreateAlistInHtml,useforforunordedlistsandfororderedlists:1)forunorderedlists,wrapitemsinanduseforeachItem,RenderingeringAsabulletedList.2)fororderedlists,useandfornumberedlists,useandfornumberedlists,casundfornumberedlists,casundfornthetthetthetthetthetthetthetttributefordforderfordforderforderentnumberingsnumberingsnumberingStys。

See all articles

熱AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智慧驅動的應用程序,用於創建逼真的裸體照片

AI Clothes Remover

AI Clothes Remover

用於從照片中去除衣服的線上人工智慧工具。

Undress AI Tool

Undress AI Tool

免費脫衣圖片

Clothoff.io

Clothoff.io

AI脫衣器

Video Face Swap

Video Face Swap

使用我們完全免費的人工智慧換臉工具,輕鬆在任何影片中換臉!

熱門文章

熱工具

SublimeText3 Mac版

SublimeText3 Mac版

神級程式碼編輯軟體(SublimeText3)

MantisBT

MantisBT

Mantis是一個易於部署的基於Web的缺陷追蹤工具,用於幫助產品缺陷追蹤。它需要PHP、MySQL和一個Web伺服器。請查看我們的演示和託管服務。

Dreamweaver CS6

Dreamweaver CS6

視覺化網頁開發工具

ZendStudio 13.5.1 Mac

ZendStudio 13.5.1 Mac

強大的PHP整合開發環境

SublimeText3漢化版

SublimeText3漢化版

中文版,非常好用