Share Tạo ngôi sao 12 cánh với CSS

[filiallion]

Language

Tiếng Việt

Bài viết này tôi tiếp tục hướng dẫn nhanh các bạn vẽ ngôi sao 12 cánh bằng CSS. Các bạn tham khảo nội dung mã lệnh như sau:

.twelve-point-star {
    width: 100px;
    height: 100px;
    position: absolute;
    background: #0062af;
}

.twelve-point-star::before {
    width: 100px;
    height: 100px;
    position: absolute;
    content: "";
    background: #0062af;
    transform: rotate(30deg);
}

.twelve-point-star::after {
    width: 100px;
    height: 100px;
    position: absolute;
    content: "";
    background: #0062af;
    transform: rotate(-30deg);
}

Và để vẽ hình ngôi sao 12 cánh các bạn sử dụng như sau:

<div class="twelve-point-star"></div>