溫馨提示×

溫馨提示×

您好,登錄后才能下訂單哦!

密碼登錄×
登錄注冊×
其他方式登錄
點擊 登錄注冊 即表示同意《億速云用戶服務(wù)條款》

html中怎么把圖片的絕對路徑改成相對路徑

發(fā)布時間:2021-08-05 10:07:51 來源:億速云 閱讀:210 作者:chen 欄目:移動開發(fā)

本篇內(nèi)容介紹了“html中怎么把圖片的絕對路徑改成相對路徑”的有關(guān)知識,在實際案例的操作過程中,不少人都會遇到這樣的困境,接下來就讓小編帶領(lǐng)大家學(xué)習(xí)一下如何處理這些情況吧!希望大家仔細(xì)閱讀,能夠?qū)W有所成!

  首先要我們要弄懂相對路徑修改成絕對路徑那么必須要知道路徑的基本概念。

  html中的路徑:指文件存放的位置,在網(wǎng)頁中利用路徑可以引用文件,完成:插入圖像、視頻等功能。表示在html中路徑的使用方式有兩種:相對路徑,絕對路徑。

1、相對路徑:

  html中的相對路徑的概念是:指當(dāng)前html頁面引用的文件 相對于 當(dāng)前html頁面文件的路徑,在html網(wǎng)頁開發(fā)過程中多采用這種方法來引用我們所想使用的內(nèi)容。

  相對路徑有多種使用的方法,這些方法標(biāo)識表示的意義也不相同。那么接下來我們來看一下是如何使用的。

./ :代表文件所在的目錄(通常情況下可以省略不寫)

../ :代表文件所在的父級目錄(也就是上一級目錄)

../../ :代表文件所在的父級目錄的父級目錄(也就是上一級上一級目錄)

/ :代表文件所在的根目錄

如:<img src=’images/1.jpg’/>表示此代碼所在html文件的路徑下的images文件夾下的1.jpg文件。

<img src=’../images/1.jpg’/>表示此代碼所在html文件的路徑的上一級的images文件夾下的1.jpg文件。

2、絕對地址:

  就是直接從磁盤的位置去定位文件的地址。類似于我們通過我的電腦一盤符的方式來尋找想要的指定內(nèi)容,或者說直接帶著協(xié)議、域名,即如這樣格式的地址:https://www.taobao.com/img/1.jpg。

如:<img src=’https://www.taobao.com/img/1.jpg’/>表示絕對路徑

3、如何把html圖片絕對路徑改為相對路徑

  可以使用html當(dāng)中給我們提供的<base/>標(biāo)簽來完成。<base> 標(biāo)簽為頁面上的所有路徑的引用設(shè)置了默認(rèn)地址或默認(rèn)目標(biāo)。 通常情況下,瀏覽器會從當(dāng)前文檔的 URL 中獲取到相應(yīng)的元素來填寫相對的引用路徑。

  首先<base/>標(biāo)簽是一個單標(biāo)簽,同時所有的瀏覽器都支持 <base/>這一個標(biāo)簽標(biāo)簽所以兼容性上大家不用考慮。同時在使用<base/>標(biāo)簽的時候必須注意<base/>標(biāo)簽,必須放置到html網(wǎng)頁的<head></head>標(biāo)簽當(dāng)中,同時每一個html頁面當(dāng)中最多只能有一個<base/>標(biāo)簽,它的作用也很明顯。就是用來為html頁面上的所有路徑引用來規(guī)定默認(rèn)地址或默認(rèn)目標(biāo),是一種設(shè)置網(wǎng)頁中引用路徑的標(biāo)記。

  剛才我們已經(jīng)在前面提到了 在html中常見的路徑形式有相對路徑和絕對路徑,那么在這個時候使用了<base/>標(biāo)簽指定了目標(biāo)的話,那么我們的用戶使用的客戶端瀏覽器就會把這個內(nèi)容解析成為當(dāng)前html中引用大的所有相對路徑,同時包括<a></a>超鏈接標(biāo)簽、<img/>圖片標(biāo)簽、<link>css引用標(biāo)簽、<form></form> 表單標(biāo)簽中的地址。也就是說,瀏覽器解析的時候會在引用的路徑的前面會自動的加上<base/>上面綁定的地址,同時在這個時候頁面中的相對路徑也都會被轉(zhuǎn)換成為絕對路徑。

使用語法:

<head>

<base href="目標(biāo)路徑" />

</head>

“html中怎么把圖片的絕對路徑改成相對路徑”的內(nèi)容就介紹到這里了,感謝大家的閱讀。如果想了解更多行業(yè)相關(guān)的知識可以關(guān)注億速云網(wǎng)站,小編將為大家輸出更多高質(zhì)量的實用文章!

向AI問一下細(xì)節(jié)

免責(zé)聲明:本站發(fā)布的內(nèi)容(圖片、視頻和文字)以原創(chuàng)、轉(zhuǎn)載和分享為主,文章觀點不代表本網(wǎng)站立場,如果涉及侵權(quán)請聯(lián)系站長郵箱:is@yisu.com進(jìn)行舉報,并提供相關(guān)證據(jù),一經(jīng)查實,將立刻刪除涉嫌侵權(quán)內(nèi)容。

AI