如果一個盒子的長寬都為零，那么它的四條border就會碰到一起，變成實心的，而且每一條border都是一個三角形；我們就可以利用三角形來實現對白框的尖下巴。

通過把border上左設置為有顏色，下右設置為透明，在#demo:before放置一個向下的等邊三角形，絕對定位使之頂部與大盒子的下邊框重合。再通過把border上左設置為白色，下右設置為透明，在大三角形里面放置一個白色小三角形，覆蓋掉一部分顏色，就形成了尖下巴?？梢杂?demo:before和#demo:after偽元素來實現，也可以在大盒子里放置小盒子再絕對定位。

html代碼：

CSS代碼：

有幾個細節需要注意：

#demo:after的兩條有色邊框應該與盒子的背景顏色相同，所以要記得給盒子設置背景顏色，而不是透明；此處我將盒子背景設置為與邊框相同的白色。

此處有絕對定位，可以不給border設置width:0px;height:0px;，正常情況是需要的，否則邊框就會拉伸成一行。

如下圖，黑三角形的兩條邊框減去白三角形的兩條邊框等于(c+d)，而為了美觀，d應該約等于a(c必須是整數，所以a不可能是整數)，這里需要一些計算。