<img src="#">
:src 為圖片的路徑。img 是 image 的縮寫。沒有結尾標籤。
圖片。
<img src="#" alt="圖片未正常出現會出現的文字" title="滑鼠移過,稍微停留會出現的文字">
正常圖片顯示,以及滑鼠移過後,出現 title 的文字。
<img src="https://alldata.sgp1.digitaloceanspaces.com/images/butterfly.png" alt="圖片未正常出現會出現的文字" title="滑鼠移過,稍微停留會出現的文字">
結果呈現
{% embed url="https://codepen.io/carlos411/pen/PoYpYvr" %}
絕對路徑:
<img src="https://alldata.sgp1.digitaloceanspaces.com/images/butterfly.png">
相對路徑:
<img src="../images/butterfly.png">
<img src="./images/butterfly.png">
.
:代表當前資料夾。
..
:代表上一層資料夾。
圖片末正常出現時,顯示 alt 的文字。
<img src="http://notes.carlos-studio.com/images/no_pic.png" alt="圖片未正常出現會出現的文字" title="滑鼠移過,稍微停留會出現的文字">
結果呈現:
暫時性的假圖網址:https://via.placeholder.com/300x200