在 HTML 中, <img>元素用於將圖像嵌入到網頁中。以下是如何使用<img>標籤的基本範例:

html
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Image Example</title> </head> <body> <h1>My Web Page</h1> <img src="example.jpg" alt="A descriptive text about the image"> </body> </html>

在這個例子中:

  • <img>標籤用於嵌入圖像。
  • src屬性指定圖像的來源(URL 或檔案路徑)。在本例中,它是“example.jpg”。
  • alt屬性為圖像提供替代文字。如果無法載入圖像或出於輔助目的,則會顯示此文字。

始終包含alt屬性非常重要,以便為可訪問性和 SEO 提供有意義的替代文字。

您也可以使用widthheight屬性來設定圖像的寬度和高度:

html
<img src="example.jpg" alt="A descriptive text about the image" width="300" height="200">

此外,您可以使用style屬性將內聯樣式套用至影像:

html
<img src="example.jpg" alt="A descriptive text about the image" style="border: 1px solid #ccc; padding: 10px;">

請記住將“example.jpg”替換為圖像的實際路徑或 URL。