Tentu!
Berikut adalah modul ajar tentang CSS pada HTML untuk mata pelajaran Informatika kelas XI SMA
dengan durasi 5 jam pelajaran (JP).
Modul Ajar: CSS pada HTML
Tujuan Pembelajaran
1. Siswa memahami konsep dasar CSS.
2. Siswa mampu mengaplikasikan CSS untuk mempercantik tampilan halaman web.
3. Siswa dapat membuat dan mengelola stylesheet eksternal.
Materi Pembelajaran
1. Pengenalan CSS
o Apa itu CSS?
o Manfaat penggunaan CSS.
2. Sintaks Dasar CSS
o Selektor, properti, dan nilai.
o Contoh:
o h1 {
o color: blue;
o font-size: 20px;
o }
3. Cara Menyisipkan CSS
o Inline CSS
o Internal CSS
o External CSS
4. Selektor CSS
o Selektor elemen
o Selektor kelas
o Selektor ID
o Contoh:
o .className {
o background-color: yellow;
o }
o #idName {
o margin: 10px;
o }
5. Properti CSS Umum
o Warna (color, background-color)
o Teks (font-size, font-family, text-align)
o Margin dan Padding
o Contoh:
o p{
o color: green;
o font-family: Arial, sans-serif;
o margin: 20px;
o }
6. Box Model
o Padding, border, margin
o Contoh:
o div {
o padding: 10px;
o border: 1px solid black;
o margin: 20px;
o }
7. Layout dengan CSS
o Display (block, inline, inline-block)
o Position (static, relative, absolute, fixed)
o Flexbox dan Grid
Kegiatan Pembelajaran
1. Pendahuluan (1 JP)
o Guru menjelaskan tujuan pembelajaran.
o Diskusi singkat tentang pentingnya CSS.
2. Inti (3 JP)
o Penjelasan materi oleh guru.
o Siswa mencoba contoh-contoh kode CSS.
o Latihan membuat halaman web sederhana dengan CSS.
3. Penutup (1 JP)
o Review materi yang telah dipelajari.
o Siswa mempresentasikan hasil kerja mereka.
o Guru memberikan umpan balik.
Penilaian
Tugas Praktik: Membuat halaman web dengan CSS.
Kuis: Pertanyaan seputar konsep dasar CSS dan penerapannya.
Semoga modul ini membantu! Jika ada yang ingin ditanyakan lebih lanjut atau butuh contoh tambahan,
jangan ragu untuk bertanya. 😊
