CSS是一種非常強大的樣式表語言，可以實現很多有趣的效果。在這篇文章里，我們將學習如何使用CSS給邊框加上一個三角形。

/* 首先，我們需要一個有邊框的元素 */
.border-box {
border: 2px solid #ccc;
padding: 20px;
position: relative; /* 確保子元素的定位可以相對于這個元素 */
}
/* 接下來，我們創建一個偽元素，代表三角形 */
.border-box::before {
content: "";
display: block; /* 將這個元素變成塊級元素 */
position: absolute; /* 絕對定位 */
top: -15px; /* 根據三角形的大小和樣式調整偏移量 */
left: 10px;
border-left: 15px solid transparent; /* 左邊的三角形邊框 */
border-right: 15px solid transparent; /* 右邊的三角形邊框 */
border-bottom: 15px solid #ccc; /* 底部的三角形邊框，注意顏色要和邊框一致 */
}

上面的代碼中，我們首先創建了一個有邊框的元素，然后使用偽元素::before來實現三角形。我們使用了border屬性來創建三角形的邊框，它由左、右、底部三個部分組成，左右兩側采用透明的邊框來生成三角形，底部采用和邊框一致的顏色來填充。

最后，我們將三角形的位置調整到邊框的上方即可。當然，具體的位置和大小可以根據需求進行調整。

在使用CSS實現有趣效果時，我們需要靈活運用各種CSS屬性和技巧，才能創造出獨特的樣式和效果。希望這篇文章對大家有所幫助！