空心三角箭头
.box{ position:relative; width: 580px; height: 300px; padding: 20px 24px; box-sizing: border-box; background: #fff; border: 1px solid #cccccc; } .box:after { content: ""; position: absolute; top: -6px; right: 44px; width: 10px; height: 10px; border-right: 1px solid #cccccc; border-bottom: 1px solid #cccccc; transform: rotate(-132deg); background: #fff; }实心三角形
.box{ position:relative; width: 580px; height: 300px; padding: 20px 24px; box-sizing: border-box; background: #fff; border: 1px solid #cccccc; } .box:after { content: ""; position: absolute; top: -6px; right: 44px; width: 10px; height: 10px; border-right: 100px solid transparent; border-left: 100px solid transparent; border-bottom: 100px solid #f00; background: #fff; }