透明空白三角形

效果如下：

 该元素hover效果：

 可以看出是要右侧有个小的空白三角形。

碎碎念：刚开始写的时候想偏了，准备用常规的空白三角形做法（给元素宽高为零，然后设置他的边框大小值），然后层级，位置，大小调整了老半天，然后因为网页时响应式的，调整好一个响应式还要再次调整，并且，他只是列表中的一个元素！，这个模块有六个这样的元素，并且大小还不一样，所以如果真用边框法设置三角形那问题就大了。

其实就一句样式就解决了，就是设置他的background: linear-gradient，具体如下：

background: linear-gradient(-135deg, transparent 72px, #21871c 0);

然后我们只要给他的宽高设置百分百，若父元素变化他也会随着变化，响应式也就一步到位了！