🎨 CSS Dasar
Level: Beginner
CSS (Cascading Style Sheets) digunakan untuk memberikan gaya pada halaman HTML.
Bayangkan CSS seperti cat dan dekorasi rumah: HTML adalah kerangka, CSS membuatnya indah dan nyaman dilihat.
📖 Cara Menghubungkan CSS
🔑 Properti CSS Dasar
color → warna teks.
background-color → warna latar.
font-size → ukuran teks.
font-family → jenis huruf.
margin → jarak luar elemen.
padding → jarak dalam elemen.
border → garis tepi elemen.
🛠️ Praktik Kecil
Buat file style.css dan hubungkan ke HTML:
/* style.css */
body {
background-color: #f0f0f0;
font-family: Arial, sans-serif;
}
h1 {
color: darkblue;
text-align: center;
}
p {
color: #333;
font-size: 16px;
}
👉 Simpan file ini, lalu buka HTML yang sudah dihubungkan dengan <link> untuk melihat hasilnya.
🎮 Mini Challenge
Buat halaman HTML dengan CSS eksternal yang memiliki:
- Latar belakang berwarna lembut (misalnya pastel).
- Heading utama dengan warna berbeda dan rata tengah.
- Paragraf dengan font berbeda dari default browser.
- Gambar dengan border dan padding.
- Link yang berubah warna saat di-hover.
Tugas tambahan: Gunakan kombinasi margin dan padding untuk mengatur tata letak agar lebih rapi.