CSS] border and :before :after

https://developer.mozilla.org/en-US/docs/Web/CSS/::before

<div style="content:'';border:24px solid #000;border-color:#f66 #ff6 #6f6 #6ff;"></div>

아래와 같게 되니 적절히 잘 사용 해보세요
<style>
.afterbefore{height:64px;background:#eee;display:inline-block}
.afterbefore:after{content:'';border:24px solid #000;border-color:#fff #fff #6f6 #6ff;}
.afterbefore:before{content:'';border:24px solid #000;border-color:#f66 #ff6 #fff #fff;}
</style>
<div class="afterbefore">this is edge border</div>

this is edge border