CSS提示三角形是在實現提示文本或箭頭指向時經常使用的一個元素。下面我們來了解一下如何用CSS繪制三角形，并且讓它能實現提示或指向的效果。

/*基本三角形*/
.arrow {
width: 0;
height: 0;
border-top: 10px solid transparent;
border-bottom: 10px solid transparent;
border-right: 10px solid red;
}
/*加陰影的三角形*/
.arrow-shadow {
width: 0;
height: 0;
border-top: 10px solid transparent;
border-bottom: 10px solid transparent;
border-right: 10px solid black;
box-shadow: 2px 2px 4px rgba(0,0,0, .3);
}
/*指向下方的三角形*/
.arrow-down {
width: 0;
height: 0;
border-left: 10px solid transparent;
border-right: 10px solid transparent;
border-top: 10px solid red;
}
/*邊框不影響效果的三角形*/
.arrow-borderless {
width: 0;
height: 0;
border-left: 10px solid transparent;
border-right: 10px solid transparent;
border-top: 10px solid red;
border-bottom: none;
}

以上代碼中使用了border的上下左右屬性，利用寬高為0的元素繪制了三角形。其中，可以通過調節邊框的大小和顏色實現不同的效果。在“指向下方的三角形”中，改為設置頂部邊框為10px，其他邊框為0即可實現效果。

此外，為了美化效果，我們可以加上一些陰影或讓它成為透明的邊線。在“加陰影的三角形”代碼中可見，設置box-shadow屬性即可加上一層陰影效果。對于“邊框不影響效果的三角形”，則是將底部邊框去掉，避免了邊框顏色對整體的干擾。

總之，使用CSS繪制三角形是一個十分實用的技巧，不僅在提示框或工具提示中使用廣泛，也可以作為箭頭指向在頁面布局中使用。希望以上介紹能夠幫助到大家。