如何在圖像上放置按鈕

Question

在HTML5中，是否有方法在圖像上添加按鈕？

例如這裏是我的HTML，

<div><a href="http://www.website.com/family/"> 
    <img src="http://www.website.com/accordian.jpg" alt="image" /> 
</a></div> 

還是有一種方法，使圖像鏈接的一部分到另一頁，圖像的另一部分鏈接到不同的網頁？我正在考慮修改圖像並放入按鈕圖像，並將圖像的這一部分鏈接到彈出式視頻。

此外，如何讓此視頻出現在彈出式窗口中？

<video width="651" height="358" controls> 
<source src="www.website.com/accordian.mp4" type="video/mp4"> 
<object data="www.website.com/accordian.mp4" width="320" height="240"> 
</object> 
</video> 

Answer 1

您可以使用Html區域，您可以在圖像上設置座標並在該區域設置鏈接。 參見示例：

<img src ="http://www.website.com/accordian.jpg" alt="image" 
usemap="#imagemap"> 

<map name="imagemap"> 
<area shape="rect" coords="0,0,50,100" href="http://www.website.com/family/" alt="Link"> 
</map>