Khả năng đáp ứng

Bài học 21 trên 23 trong khóa học Dự án slider giao diện người dùng của Coddy.

Thử thách

Dễ

1. Với các biểu tượng trong lớp wrapper, hãy đặt transform: translateY(-50%) scale(0.85); cho :active.

2. Hãy thử làm cho thanh trượt có khả năng thích ứng như thế này, xem gợi ý nếu bạn gặp khó khăn.

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 slider giao diện người dùng

Tự luyện tập: Playground Web