Lompat ke konten
Rahman FakhruDiskusi proyek

Pelajaran 02 / 17

CSS: tampilan dan tata letak

CSS mengatur RASA halaman Selector memilih elemen, properti mengubah gayanya: h1 { color: darkgreen; } .kartu { padding: 16px; border radius: 12px; box shadow: 0 2px 8px rgba 0,0,0,.08 ; } Konsep yang paling sering kamu

#CSS mengatur RASA halaman

Selector memilih elemen, properti mengubah gayanya:

h1 { color: darkgreen; }
.kartu {
  padding: 16px;
  border-radius: 12px;
  box-shadow: 0 2px 8px rgba(0,0,0,.08);
}

#Konsep yang paling sering kamu sentuh

  • Box model: margin (luar) → border → padding (dalam) → isi
  • Flexbox untuk menyusun sejajar; grid untuk susunan dua arah
  • Responsive: mulai dari layar kecil, perlebar dengan media query

Di proyek modern kamu akan sering bertemu Tailwind CSS — utility class seperti p-4, rounded-xl, flex yang menggantikan file CSS panjang. Prinsipnya sama; hanya cara menulisnya yang ringkas.

Latihan dengan AI: berikan screenshot desain yang kamu suka dan minta AI menirunya dengan Tailwind, lalu ubah-ubah nilainya untuk merasakan efeknya.

#Referensi