XHTML入門學習教程:XHTML網頁圖片應用

合理的添加圖片可以使一個網頁更加的美觀。

圖片標籤<img>

<img>標籤用於在網頁裡插入圖片。 <img>標籤有一個重要的屬性src，它的屬性值就是圖片的地址。下面我們就在我們的index.html裡插入一個圖片。打開index.html文件，在</body>前加上如下代碼：

保存後瀏覽網，請確認您的網頁與該頁面相同。

我們注重到<img>是一個空標籤，需要在結尾加上一個/以符合XHTML的要求。這裡的例子除src外還有一個屬性alt，我們把它叫做做替換屬性，當圖片由於某種原因而無法顯示的時候，alt的屬性值就會代替圖片出現；而當圖片正常顯示時，只要把鼠標停在圖片上就會看到alt屬性的屬性值。

用圖片作為鏈接

我們在之前的教程中曾經學習過創建超級鏈接，下面我們打開index.html並且將剛插入的代碼改為下面這段：

保存後瀏覽網頁，請再次確認您的網頁與這個網頁相同。看看圖片是不是變成了超級鏈接，點擊一下圖片就會進入菜鳥吧的主頁了。

關於XHTML的效驗

從本節開始我們就不再修改index.html這個網頁的外觀了，現在將我們製作的網頁送交權威機構檢驗一下。首先進入：http://validator.w3.org/，該頁面就是一個XHTML效驗工具，它用來檢驗我們製作的網頁是否符合XHTML的標準。您可以選擇用網址效驗，也可以上傳文件效驗。您可以選擇文件上傳效驗，方法如下：

在Validate by File Upload有Local File一欄，點擊瀏覽，找到並選中之前保存的index.html，然後點擊check按鈕。您的結果應該與我們通過網址效驗的結果一樣。返回如下錯誤信息：