CSS - Tooltip-arrow 绘制三角形 - Html/Css

小程序：扫一扫查出行
【扫一扫了解最新限行尾号】
复制小程序

问题：纯CSS实现bubble的三角形部分

方法：使用border来绘制三角形；例如

.trangle {
width:;
border-color: transparent;
border-style: solid;
background-color: #fff;
border: 19px solid #666;
}
.trangle-up {
border-width: 0 19px 35px;
border-bottom-color: #333333;
}
.trangle-down {
border-width: 35px 19px 0;
border-top-color: #333333;
}
.trangle-left {
border-width: 19px 35px 19px 0;
border-right-color: #333333;
}
.trangle-right {
border-width: 19px 0 19px 35px;
border-left-color: #333333;
}