zwsnail / a-rotating-yingyang Goto Github PK

        #八卦>div:nth-child(5) {
            /* border: 10px solid rgb(235, 53, 21); */
            width: 50px;
            height: 50px;
            background: black;
            position: absolute;
            left: 50%;
            margin-left: -25px;
            /* 也可以写bottom：0；就下去了 */
            top: 50px;
            border-radius: 50%;
        }

        @media (max-width: 500px) {
            #八卦>div:nth-child(5) {
                width: 25px;
                height: 25px;
                margin-left: -12.5px;
                top: 25px;
            }
        }

animation: x 20s infinite linear;
//把这个x具体化👇
@keyframes x {
    from {
       transform: rotate(0deg)
    }

    to {
        transform: rotate(360deg);
    }
}