css3+html画五星红旗

半个，还差一点，但是我懒

用边框写的，绝对定位，然后写好一个，其他的写旋转缩放去网页调整到合适位置


    <style>
        {
            margin: 0;
            padding: 0;
        }
        section {
            width: 600px;
            height: 400px;
            background-color: red;
            margin: 0 auto;
            position: relative;
            margin: 30px auto;
        }
        div{
            width: 0;
            height: 0;
            border-top: yellow solid 30px;
            border-left: transparent solid 50px;
            border-right: transparent solid 50px;
            position: absolute;
            margin-top: 40px;
            margin-left: 40px;
        }
        div::before {
            content: '';
            width: 0;
            height: 0;
            border-top: yellow solid 30px;
            border-left: transparent solid 50px;
            border-right: transparent solid 50px;
            transform: rotate(72.5deg);
            display: block;
            margin-left: -49px;
            margin-top: -28px;
        }

        div::after {
            content: '';
            width: 0;
            height: 0;
            border-top: yellow solid 30px;
            border-left: transparent solid 50px;
            border-right: transparent solid 50px;
            transform: rotate(-72.5deg);
            display: block;
            margin-left: -50px;
            margin-top: -28px;
        }

        .x2 {
            margin-top: 13px;
            margin-left: 127px;
            transform: rotate(22deg) scale(0.25);
        }

    </style>


//html
<body>
<section class="hong">
    <div class="x1"></div>
    <div class="x2"></div>
    <div class="x3"></div>
    <div class="x4"></div>
    <div class="x5"></div>
</section>
</body>
</html>