Circular progress ::before
Bài học 8 trên 11 trong khóa học Thanh tiến trình hình tròn | Dự án front-end của Coddy.
Bây giờ chúng ta cần viết CSS cho:
.circular-progress::before{
/*Write below*/
}Nếu bạn bí, hãy xem gợi ý.
Thử thách
Dễ- Đặt content thành
“” - Đặt position thành tuyệt đối
- Đặt chiều cao và chiều rộng thành 190 pixel.
- Đặt bán kính đường viền thành 50%.
- Đặt màu nền tương tự màu nền của lớp
circular-progress.
Tự làm thử
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="styles.css">
</head>
<body>
<!-- Viết code HTML ở đây -->
<script src="script.js"></script>
</body>
</html>Tất cả bài học trong Thanh tiến trình hình tròn | Dự án front-end
1Giới thiệu
Bạn sẽ tạo ra gì?4JavaScript
Làm cho nó chạy!
3CSS
Bộ chọn toàn cụcBodyLớp containerLớp circular progressCircular progress ::beforeLớp giá trị tiến trìnhLớp văn bảnTự luyện tập: Playground Web