CSS带小三角形的div框
效果图:
<span class="hint_prompt">超时20天</span>
.hint_prompt { border: 1px solid #fff1f0; border-radius: 4px; margin: 50px; text-align: center; border: 1px solid #fff1f0; position: relative; padding: 3px 5px; background: #fff1f0; font-family: PingFangSC-Regular; font-weight: 400; font-size: 14px; color: #fd4b40; } .hint_prompt::before { content: ""; position: absolute; left: -56px; top: -43px; width: 10px; height: 10px; margin: 50px; transform: rotate(-45deg); background: #fff1f0; z-index: 0; border-top: 2px solid #fff1f0; border-left: 2px solid #fff1f0; }