iT邦幫忙

2021 iThome 鐵人賽

DAY 5
2
自我挑戰組

給自己學習30天重新認識css系列 第 5

絕對路徑及相對路徑

  • 分享至 

  • xImage
  •  

Yes

上一篇提到圖片匯入方式最重要環節就是src屬性,相對路徑及絕對路徑使用方式
要注意相對路徑檔案及絕對路徑差別

相對路徑:

.目前的目錄
/根目錄
..上一層目錄

    <img src="./images/logo.png">
    目前的目錄下的檔案
    <img src="/images/logo.png">
     目前的目錄下的檔案
    <img src="../test/images/logo.png">
    上一層目錄下的圖片檔案

絕對路徑:

    https://condescending-brattain-537589.netlify.app/img/logo.png
    WWW網路伺服器上的圖片檔案
    
    file:///C:/Users/user/Desktop/test/images/logo.png
    本機上c槽在桌面上test目錄下的圖片檔案

參考資料:
第7章製作超連結相對路徑與絕對路徑的觀念 - 林偉川
【網路教學】相對路徑與絕對路徑


上一篇
img圖片標籤基本語法
下一篇
p段落標籤-基礎用法
系列文
給自己學習30天重新認識css16
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

1 則留言

0
Wozski
iT邦新手 5 級 ‧ 2022-10-21 12:53:34

謝謝大大分享,剛好最近遇上類似問題.
感謝解惑!

我要留言

立即登入留言