HTML5中的圖片按鈕是一個非常實用的功能，可以為我們的網頁帶來更加豐富的體驗和交互性。下面我們來學習一下HTML5中圖片按鈕的代碼。 首先，我們需要先在HTML頭部中引入圖片按鈕的圖片資源：

<link rel="stylesheet" type="text/css" href="button.css" />
<script src="button.js" type="text/javascript"></script>

這個代碼塊會引入我們后面需要使用的CSS和JavaScript文件。 接下來，我們需要在HTML代碼中添加一個圖片按鈕標簽。圖片按鈕標簽是一個a標簽，其中嵌套一個img標簽，用于顯示按鈕的圖片。例如：

<a href="#" class="button"><img src="button.png" alt="按鈕"></a>

這個代碼塊中，我們使用了類名“button”來設置按鈕的樣式，同時設置了按鈕的圖片源為“button.png”，按鈕的alt屬性為“按鈕”。 最后，我們需要在CSS文件中設置按鈕的樣式。例如：

p {
text-align: center;
}
.button {
display: inline-block;
text-align: center;
vertical-align: middle;
margin: 10px;
padding: 5px;
background-color: #ccc;
border: 1px solid #999;
border-radius: 5px;
-webkit-box-shadow: 0px 0px 3px #999;
-moz-box-shadow: 0px 0px 3px #999;
box-shadow: 0px 0px 3px #999;
}
.button img {
display: inline-block;
vertical-align: middle;
margin-right: 5px;
}

這個代碼塊中，我們設置了按鈕的外觀樣式，包括背景顏色、邊框顏色、陰影效果等，以及按鈕圖片的樣式，包括垂直對齊、邊距等。 以上就是HTML5中圖片按鈕的相關代碼，通過這些代碼，我們可以輕松地實現一個漂亮而實用的圖片按鈕。