在這個教程中，我們將學習如何使用 CSS 創建一個簡單的照片框。

首先，我們需要創建一個包含我們的照片的 div 元素，并給它一個類名來進行樣式化。

<div class="photo-frame">
<img src="your-photo.jpg" alt="your photo">
</div>

接下來，我們將使用 CSS 給這個元素添加樣式。

.photo-frame {
border: 10px solid #000;
padding: 20px;
width: 500px;
}
.photo-frame img {
width: 100%;
height: auto;
}

這段 CSS 代碼添加了一個 10px 的黑色邊框和 20px 的內邊距到我們的照片框。我們還將它的寬度設為 500px。在照片框內部，我們將照片的寬度設為 100%，以適應照片框的寬度，并保持高度的比例。

最后的結果是一個簡單的照片框，可以輕松地根據您的需要進行自定義。