在網站設計中，CSS邊框是一個非常重要的元素，可以用來分隔頁面不同的部分，也可以用來強化頁面元素的重要性。然而，有時候我們希望CSS邊框在上下兩個方向具有不同的顏色，這該如何實現呢？ 在CSS中，我們可以使用border-top-color和border-bottom-color屬性來分別控制頂部和底部邊框的顏色。以下是使用這兩個屬性的示例代碼：

p {
border-top: 3px solid red;
border-top-color: green;
border-bottom: 3px solid blue;
}

在這個例子中，段落的頂部邊框是3像素寬的紅色實線邊框，并且使用border-top-color屬性將其顏色修改為綠色。底部邊框與之類似，是3像素寬的藍色實線邊框。 當然，我們也可以使用簡寫形式的border屬性，如下所示：

p {
border: 3px solid;
border-top-color: green;
border-bottom-color: blue;
}

這個示例中，我們使用了border屬性同時定義了三個邊框的寬度、樣式和顏色，然后使用border-top-color和border-bottom-color屬性分別控制頂部和底部邊框的顏色。 總之，通過控制border-top-color和border-bottom-color屬性，我們可以輕松實現CSS邊框上下不同顏色的效果。這種技巧可以增加網站設計的多樣性，也可以為頁面元素的排版帶來新的可能性。