如何通过纯CSS实现气泡对话框尖角？

<div class="dialog-box"> 
 <span class="bot"></span> 
 <span class="top"></span> 
</div> 

.dialog-box { 
 position: relative; 
 span { 
  width:0;  
  height:0;  
  font-size:0;  
  overflow:hidden;  
  position:absolute; 
  &.bot{ 
   border-width: 15px;  
   border-style: solid dashed dashed;  
   border-color: transparent transparent #F9743A transparent;  
   left: 15px;  
   top: -29px; 
  } 
  &.top{ 
   border-width:13px;  
   border-style:solid dashed dashed;  
   border-color:transparent transparent #fff transparent;  
   left:17px;  
   top:-25px; 
  } 
 } 
}