Menu
CoddyTech
Bắt đầu học

Điện toán đám mây II

Bài học 5 trên 18 trong khóa học Dự án mây chuyển động với HTML/CSS/JS của Coddy.

challenge icon

Thử thách

Dễ

Trong tệp HTML, hãy tạo một div bên trong div đám mây (.cloud) với tên lớp "cloudBubble1".

 

Trong tệp CSS, chọn div mới và đặt:

  1. width thành 100px
  2. height thành 100px
  3. màu nền giống với màu trong div đám mây
  4. bán kính viền là 50px
  5. position thành absolute
  6. top thành -50px
  7. left thành 30px

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ệu

4Thử sức với JS

Tạo đám mâyBài học dự ánVị trí ngẫu nhiênBài học dự ánKích thước ngẫu nhiênBài học dự án

2Vùng chứa

Phần thânVùng chứaBài học dự án

5Di chuyển đám mây

Giá trị cố địnhBài học dự ánDi chuyển sang phảiBài học dự ánĐổi hướng luân phiênBài học dự ánBắt đầu ngayBài học dự ánNgẫu nhiên hóa mọi thứBài học dự án

3Điện toán đám mây

Điện toán đám mây IBài học dự ánĐiện toán đám mây IIBài học dự ánĐiện toán đám mây IIIBài học dự án

6Nhiều đám mây

Chèn HTML bằng JSBài học dự ánChèn các đám mâyBài học dự ánLặp qua tất cảBài học dự ánHoàn thiệnBài học dự án

Tự luyện tập: Playground Web