CSS实现三角形

84 阅读1分钟
        .box {
            width: 0;
            height: 0;
            border:100px solid transparent;
            border-top-color: red;
            border-left-color: red;
            border-right-color: red;
            border-bottom-color: red; 
            }

image.png

    .box {
            width: 0;
            height: 0;
            border:100px solid transparent;
            border-top-color: red;
         }

image.png

    .box {
            width: 0;
            height: 0;
            border:100px solid transparent;
            border-left-color: yellow;
         }

image.png

    .box {
            width: 0;
            height: 0;
            border:100px solid transparent;
            border-right-color: green;
         }

image.png

    .box {
            width: 0;
            height: 0;
            border:100px solid transparent;
            border-bottom-color: blue;
         }

image.png