css画图形

1.css画实心三角形

原理: 先画一个最简单正方形 高、宽都为10px 然后为他加上边框也为10px 这个时候你就会发现,他变成了一个梯形 假如需要画一个向下的实心尖头,那么就先将梯形的右,下,左边框隐藏。然后就得到一个等腰梯形 这个等腰梯形的宽和高还是为10px,如果想要变成尖的三角形,那么就是直接去掉高和宽 具体实现看如下的 codepen ##2.画空心箭头 原理: 1.先画一个正方形,然后将正方形旋转45度,最后隐藏其他边框 具体实现看如下的 codepen

See the Pen css draw by chris (@isevenfox) on CodePen.