Desain responsif

Pelajaran 10 dari 10 dalam kursus Animasi Gerhana Matahari | Proyek HTML/CSS di Coddy.

Tantangan

Mudah

Tulis media query untuk max-width 768px.
Di dalam query @media,
1. Targetkan class moon.
2. Atur width dan height menjadi 160px.

Lihat petunjuk jika kamu tidak yakin. Sekarang, saat menyesuaikan ukuran layar, bulan akan membesar atau mengecil sesuai ukurannya!

Coba sendiri

<!DOCTYPE html>
<html>
<head>
    <link rel="stylesheet" href="styles.css">
</head>
    <body>
        <!-- Tulis kode HTML di sini -->
        <script src="script.js"></script>
    </body>
</html>

Semua pelajaran di Animasi Gerhana Matahari | Proyek HTML/CSS

1HTML

Apa yang akan kamu buat?Penyiapan Kode Wadah Bulan

2CSS

Elemen semu pada class moon

Animasi gerhana

Desain responsif Pelajaran proyek

Latihan sendiri: Playground Web