那麼即便是新手對文字添加超連結這個功能也並不陌生，也就是給某段文字添加a標籤。然後在a標籤中加上要跳轉的新地址就可以了。即便不能完全理解，只要照葫蘆畫瓢，依然能用的得心應手。
但是有的新手可能會問 文字會了，那HTML點擊圖片跳轉到新頁面這個功能效果該如何?？其實依然和文字添加超連結大同小異。本篇文章就給大家介紹HTML點擊圖片跳轉到新頁面的功能是怎麼實現的？
下面我們通過一個簡單的HTML程式碼範例：
<!DOCTYPE html><html><head> <meta charset="utf-8"> <title>HTML點擊圖片跳轉頁面樣本</title> <style>img{width: 80px ;height: 80px;} </style></head><body><a href="http://www.php.cn"><img src="/test/img/2.png"> </a></body></html>
以上代碼可以直接複製粘貼在本地測試，我在本地測試效果如：
因為是截的圖所以無法看到點擊後跳轉的頁面，但是我在本地親自測試過，只要點擊上面的圖片。就是跳轉到我指定的新連結地址《php中文網》。a標籤中herf後面就指定的新地址。想要實現點擊圖片跳轉頁面這個效果，只要掌握了a標籤和img標籤，這裡友情提醒下：img圖片的路徑一定要對啊。
那麼通過以上文章關於HTML點擊圖片跳轉新頁面的相關介紹。希望對大家有所協助。
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
