【CSS】3.CSS写一个箭头

::after
.arrow{
    width: 0;
    height: 0;
    border: 6px solid #252525;
    border-color: transparent transparent transparent #252525;
    position: relative;
    box-sizing: border-box;
    -ms-transform: translateX(6px);
    transform: translateX(6px);
}

.arrow::after {
    content: '';
    display: block;
    width: 0;
    height: 0;
    left: -6px;
    top: -6px;
    border: 6px solid red;
    position: absolute;
    box-sizing: border-box;
    transform: translateX(-2px);
    border-color: transparent transparent transparent #fff;
}

你可能感兴趣的:(CSS,前端,css,css3,面试)