css实现倒三角效果

<style>
.arms {
width: 340px;
height: 150px;
position: absolute;
background-color: red;
box-shadow: 0px 0px 10px #000
}
.arms::after {
content: '';
display: block;
position: absolute;
height: 0;
             width: 0;
             overflow: hidden;
             font-size: 0;
             line-height: 0;
             border-color: #ffffff transparent transparent transparent;
             border-style: solid;
             border-width: 20px;  
             top: 150px;
left: 100px

}

</style>

<div class="arms"></div>