post圖html,9.19/2026,

-

要在 HTML 中插入（post）圖片，最核心使用的標籤是 <img>。

以下是基本語法與常用屬性的完整說明：

1. 基本語法

html

<img src="圖片網址" alt="圖片替代文字">

請謹慎使用程式碼。

src（Source）：必填。填入圖片的網址（絕對路徑）或檔案路徑（相對路徑）。
alt（Alternate text）：強烈建議填寫。當圖片無法顯示時出現的文字，也有助於 SEO 搜尋引擎最佳化與無障礙網頁設計。

---

2. 常用調整屬性

如果你想調整圖片的尺寸或增加超連結，可以使用以下語法：

調整圖片大小（寬度與高度）

直接在標籤內加上 width（寬）或 height（高），單位為像素（px）。

提示： 建議只設定其中一個（例如只設寬度），另一個會自動等比例縮放，圖片才不會變形。

html

<img src="https://example.com" alt="風景照" width="500">

請謹慎使用程式碼。

點擊圖片跳轉網址（圖片超連結）

將 <img> 標籤包在 <a>（超連結）標籤裡面：

html

<a href="https://google.com" target="_blank">
  <img src="https://example.com" alt="Google 標誌">
</a>

請謹慎使用程式碼。

href：點擊圖片後要引導過去的網址。
target="_blank"：在新分頁打開連結。

---

3. RWD 響應式圖片（自動適應手機與電腦螢幕）

現代網頁設計中，通常會希望圖片能隨著外層容器的大小自動縮放，可以在 HTML 或 CSS 中加上 style="max-width: 100%; height: auto;"：

html

<img src="https://example.com" alt="響應式圖片" style="max-width: 100%; height: auto;">

請謹慎使用程式碼。

若

end