HTML5給圖片設置相框是一種常見的網頁設計技巧。通常，我們可以使用CSS對圖片邊框進行美化。但是，如果您想要更加獨特的設計，那么在圖片周圍添加相框將是一個不錯的選擇。 要實現這一效果，我們需要在HTML5中使用相框元素。下面是一個例子：

<p>這是一張帶有相框的圖片：</p>
<figure class="frame">
<img src="example.jpg" alt="示例圖片">
<figcaption>圖片說明</figcaption>
</figure>

上面的代碼中，我們使用了`figure`元素來包含圖片和其說明，同時使用了`class`屬性來給`figure`元素添加了一個名為`frame`的類。這個類將在CSS樣式表中用來為相框添加樣式。 接下來，我們需要在CSS樣式表中添加一些樣式來為相框添加美化效果。以下是一個例子：

.frame {
border: 4px solid #333;
padding: 10px;
margin: 20px 0;
box-shadow: 2px 2px 5px rgba(0,0,0,0.3);
}
.frame img {
display: block;
width: 100%;
height: auto;
}

上面的代碼中，我們為`frame`類添加了一些樣式，其中包括邊框、內邊距、外邊距和陰影。我們還用`img`元素的樣式來強制圖片占滿其容器，并根據需要自動調整其高度。 這樣，我們就可以設置一個美麗的相框來顯示圖片了！當然，您可以使用自己的樣式和圖片來創建更加個性化的設計。