在網頁設計中，我們經常會使用圖片來美化頁面，但有些時候我們需要給圖片加上邊框，這時候就需要用到CSS來實現。下面是詳細步驟。 首先，我們來看一下如何將圖片鏈接到網頁上：

<img src="圖片路徑" alt="文字描述" />

其中，img標簽用于插入圖片，src屬性用于指定圖片路徑，alt屬性用于文字描述。通常情況下，圖片路徑是一個地址，可以是網絡地址或本地地址。如果圖片找不到，alt屬性會顯示出文字描述，避免頁面空白。 然后，接下來就是如何在CSS中為圖片添加邊框：

img {
border: 1px solid black;
}

我們可以用CSS來為所有的圖片添加邊框，這里的代碼中，border屬性指定邊框樣式，1px是邊框的厚度，solid是邊框的樣式，black則是邊框的顏色。 當然，我們也可以為個別圖片設置不同的邊框樣式：

<img src="圖片路徑" alt="文字描述" style="border: 3px dotted red;" />

這里的代碼中，style屬性用于為HTML元素定義樣式，border屬性同樣用于指定邊框樣式，dotted是邊框的樣式，red則是邊框的顏色。需要注意的是，style屬性的優先級高于CSS，所以它所定義的樣式會覆蓋CSS中的樣式。 最后，我們可以使用CSS3中的box-shadow屬性來為圖片添加陰影效果：

img:hover {
box-shadow: 3px 3px 3px gray;
}

這里的代碼中，:hover偽類用于指定鼠標懸浮在圖片上時的效果，box-shadow屬性用于指定陰影的樣式，其中3px是陰影的偏移量，gray是陰影的顏色。 總的來說，利用CSS為圖片添加邊框是一個很簡單的操作，不僅可以讓頁面更加美觀，還可以提高用戶體驗，增加頁面交互性。