css制作的圆，三角形，椭圆，箭头图标

圆：

.yuan{
    width:100px;
    height:100px;
    -moz-border-radius:50%; 
    -webkit-border-radius:50%; 
    border-radius:50%; 
    background-color:red;
}

登录后复制

椭圆

.oval { 
    width: 200px; 
    height: 100px; 
    background-color: red; 
    -moz-border-radius: 100px / 50px; 
    -webkit-border-radius: 100px / 50px; 
    border-radius: 100px / 50px; 
}

登录后复制

箭头：

.arrow{
    content: '';
    position: absolute;
    width: 30px;
    height: 30px;
    border: 10px solid #f5b24a;
    -webkit-transform: rotate(-135deg);
    -moz-transform: rotate(-135deg);
    -o-transform: rotate(-135deg);
    -ms-transform: rotate(-135deg);
    transform: rotate(-135deg);
    border-top: none;
    border-right: none;
    top: 9px;
}

登录后复制

三角形：

.rencentle {
    width: 0;
    height: 0;
    border-left: 50px solid transparent;
    border-right: 50px solid transparent;
    border-bottom: 100px solid red;
}

登录后复制