<div class="d"></div>
<style>
.d::after {
content: "";
border-style: solid;
border-width: 40px 40px 0 40px;
display: inline-block;
border-color: black transparent transparent transparent
}
</style>
实现原理 顺序都是上右下左。
将指定方向边宽度为0，对角边设置颜色即可实现上下指定转向。
在移动端设置图纸上的指定大小，然后通过 transform: scale(0.5)实现缩小，这个和移动端1像素实现原理相同
原文：https://www.cnblogs.com/codylau/p/11171773.html