我试着用CSS创建一个三角形,它看起来不错,但我现在有一个问题,在一个框后实现它。
看看我的例子,你会看到我的意思:
它似乎像.Box的三角形被“切断”,我完全不知道为什么这种情况发生。
我想让它看起来像.arrow。
我试图改变盒子的尺寸,三角形等,但没有工作。
p.s.这里是css如果Jsfiddle是慢或不再可用:
.Box{ background:red; height:40px; width:100px; } /*the triangle but its being cut off*/ .Box:after{ content:""; width:0; height:0; border-top:20px solid transparent; border-bottom:20px solid transparent; border-left:20px solid green; } /*the triangle how it should look like*/ .arrow{ width:0; height:0; border-top:20px solid transparent; border-bottom:20px solid transparent; border-left:20px solid green; }