Giá trị cố định
Bài học 10 trên 18 trong khóa học Dự án mây chuyển động với HTML/CSS/JS của Coddy.
Hãy di chuyển đám mây!
Thử thách
DễTrước khi bắt đầu di chuyển đám mây, hãy cố định vị trí và kích thước của đám mây.
Chú thích đoạn code đặt vị trí và kích thước ngẫu nhiên cho đám mây.
Trong tệp JS, nhắm đến phần tử đám mây và:
- Đặt thuộc tính kiểu
leftthành200px. - Đặt thuộc tính kiểu
topthành200px. - Đặt thuộc tính kiểu
transformthànhscale(0.5).
Đồng thời, đặt thuộc tính kiểu transition thành "all linear 3s", thuộc tính này sẽ giúp chúng ta tạo hiệu ứng chuyển động cho đám mây sau này!
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 Dự án mây chuyển động với HTML/CSS/JS
1Giới thiệu
Giới thiệu5Di chuyển đám mây
Giá trị cố định
Di chuyển sang phảiĐổi hướng luân phiênBắt đầu ngayNgẫu nhiên hóa mọi thứTự luyện tập: Playground Web