纯CSS实现小三角

代码

<style type="text/css">

.arrow:before{
width: 0px;
height: 0px; 
position:absolute;
margin-left: -40px;
margin-top:-5px;
content:"";
border: 10px solid rgba(255,255,255,0.8);
border-bottom-color:transparent;
border-top-color:transparent;
border-left-color:transparent;
}

</style>

<div class="arrow" style="width: 100%;padding:20px;border-radius:5px;background-color: rgba(255,255,255,0.8);">

这里是内容,具体小的细节自己调整

</div>

下面贴出效果图