Apa itu CSS & mengapa penting
- 3 cara menyisipkan CSS (inline, internal, external)
- Sintaks: selector, property, value
- Komentar dalam CSS
- Cascade & Specificity dasa
🎯 Styling Halaman Profil Sederhana
Buat halaman HTML dengan nama, foto, dan bio singkat. Terapkan CSS via 3 metode berbeda untuk memahami perbedaan prioritas dan penerapannya.
/* ============================
HARI 1: Pengenalan CSS
============================ */
/* External CSS - cara terbaik */
/* <link rel="stylesheet" href="style.css"> */
/* 1. Selector Elemen */
body {
font-family: 'Segoe UI', sans-serif;
background-color: #f0f4f8;
color: #1a202c;
margin: 0;
}
/* 2. Selector ID - spesifisitas tinggi */
#profil-utama {
max-width: 600px;
margin: 40px auto;
padding: 32px;
background: white;
border-radius: 12px;
box-shadow: 0 4px 24px rgba(0,0,0,0.08);
}
/* 3. Selector Class */
.nama-pengguna {
font-size: 28px;
font-weight: 700;
color: #2d3748;
margin-bottom: 8px;
}
.bio-teks {
font-size: 16px;
line-height: 1.7;
color: #718096;
}
/* Specificity: ID (1,0,0) > Class (0,1,0) > Element (0,0,1) */