一、下拉实心尖角标
实现代码:
<div class="angle" />
.angle {
width: 0;
height: 0;
border-left: 10px solid transparent;
border-right: 10px solid transparent;
border-bottom: 10px solid #000;
}
二、下拉空心尖角标
实现代码:
<div class="angle" />
.angle {
position: fixed;
display: block;
width: 0;
height: 0;
border-color: transparent;
border-style: solid;
border-top-width: 0;
border-bottom-color: #000;
border-width: 10px;
}
.angle::after {
position: absolute;
display: block;
width: 0;
height: 0;
border-color: transparent;
border-style: solid;
content: " ";
border-width: 10px;
top: 1px;
margin-left: -10px;
border-top-width: 0;
border-bottom-color: #fff;
}