Menu
CoddyTech

Tantangan Rangkuman #1

Termasuk bagian Menata dengan CSS dalam perjalanan HTML di Coddy. Pelajaran 29 dari 76.

challenge icon

Tantangan

Mudah

Sekarang setelah kamu menguasai berbagai teknik untuk menata teks dan latar belakang menggunakan CSS, saatnya menguji pengetahuanmu dengan tantangan menyeluruh. Kamu akan menerapkan hal-hal yang telah dipelajari tentang warna, kode hex, nilai RGB, dan transparansi dengan RGBA untuk membuat desain tertentu.

Kamu diberi dokumen HTML dengan heading (<h1>), paragraf (<p>), dan division (<div>). Tugasmu adalah menggunakan properti penataan teks dan latar belakang yang telah dipelajari untuk menata elemen-elemen ini agar sesuai dengan desain yang ditampilkan pada gambar di bawah:

Ikuti langkah-langkah di bawah ini:

  1. Tulis aturan CSS yang menargetkan elemen <h1>. Atur color menjadi white, background-color menjadi #000080 (biru navy), dan text-align menjadi center.
  2. Tulis aturan CSS yang menargetkan elemen <p>. Atur color menjadi #FFFFFF (putih), background-color menjadi rgba(0, 0, 0, 0.5) (hitam semi-transparan), dan font-size menjadi 18px.
  3. Tulis aturan CSS yang menargetkan elemen <div>. Atur background-color menjadi rgba(237, 170, 26, 1) (kuning keemasan) dan color menjadi white.

Coba sendiri

<html>
<head>
    <title>Recap Challenge #1</title>
    <style>
        /* Write CSS rules here */
    </style>
</head>
<body>
    <h1>This is a heading</h1>
    <p>This is a paragraph.</p>
    <div>This is a division.</div>
</body>
</html>

Semua pelajaran di Menata dengan CSS

Latihan sendiri: Playground Web