BELAJAR CSS DASAR : SELEKTOR DAN PROPERTI CSS #02

-
Pembelajaran CSS: Selektor dan Properti

Oke, sekarang kita masuk ke bagian penting dalam CSS, yaitu selektor dan properti. Kalau kamu baru mulai belajar CSS, mungkin ada yang bertanya, "Apa sih selektor itu?" Nah, selektor adalah cara kita memilih elemen HTML mana yang ingin kita kasih gaya. Sedangkan, properti adalah hal-hal yang kita ubah, seperti warna, ukuran teks, atau jarak antar elemen. Jadi, selektor itu ibarat alamatnya, dan properti itu adalah apa yang mau kita ubah.

Selektor Berdasarkan Elemen HTML

Selektor yang paling dasar adalah selektor elemen. Artinya, kita memilih elemen HTML tertentu, misalnya semua <h1>, <p>, atau <div> yang ada di halaman web, lalu kita terapkan gaya yang kita inginkan ke semuanya.

Contoh sederhananya begini:


<!DOCTYPE html>
<html lang="id">
    <head>
        <style>
            h2 {
                color: green;
            }
            p {
                color: gray;
            }
        </style>
    </head>
    <body>
        <h2>Ini adalah Judul dengan Warna Hijau</h2>
        <p>Ini adalah paragraf dengan warna abu-abu.</p>
        <p>Paragraf ini juga berwarna abu-abu.</p>
    </body>
</html>

Hasilnya:

  • Judul dengan tag <h2> akan tampil hijau.
  • Semua paragraf <p> di halaman jadi abu-abu.

Comments

Post a Comment

Popular posts from this blog

Belajar HTML #01: Pengenalan Dasar HTML untuk Pemula

-
Image
Kenalan Dulu Nih Dengan HTML      HTML adalah bahasa yang sangat penting untuk dipelajari bagi siapa saja yang ingin menjadi web developer Mengapa demikian? Karena HTML adalah fondasi utama dalam pembuatan halaman web. Pasti kamu sudah pernah mendengar tentang HTML sebelumnya, tetapi tidak ada salahnya untuk menyegarkan ingatanmu dengan membaca artikel ini. Dalam tutorial ini, kita akan membahas semuanya dari awal hingga kamu mampu membuat halaman HTML-mu sendiri. Jadi, siap untuk memulai petualangan ini? Ayo kita mulai! Apa Itu HTML? HTML, atau HyperText Markup Language,   adalah bahasa markah yang digunakan untuk membuat halaman web . Masih bingung?  Mari saya jelaskan dengan cara yang lebih sederhana.. HTML adalah bahasa yang menggunakan penanda, yang kita sebut " tag ," untuk merancang halaman web. Tag ini membantu kita menentukan bagaimana konten akan ditampilkan dan disusun di dalam sebuah situs web Jika kita ibaratkan, HTML itu seperti batu bata yang digu...
Read more

Belajar HTML #03: Membuat paragraf dalam HTML

-
Image
  Hai teman-teman! Setelah kita belajar tentang dasar-dasar HTML, seperti apa itu tag, elemen, dan atribut, sekarang saatnya untuk melangkah lebih jauh. Kali ini, kita akan mengenal beberapa elemen dasar HTML yang sering digunakan saat membuat website. Yuk, kita mulai dengan elemen paragraf. Apa sih elemen paragraf itu? Mari kita bahas bersama! Membuat Paragraf di HTML Halo, teman-teman! Mari kita ngobrol tentang paragraf. Apa sih paragraf itu? Sederhananya, paragraf adalah kumpulan beberapa kalimat yang kita satukan untuk menyampaikan informasi. Dalam dunia web, kita biasanya menggunakan paragraf untuk menampilkan teks atau artikel yang ingin kita bagi. Di HTML, kita bisa membuat paragraf dengan menggunakan tag <p>. Ini sangat mudah! Tapi tunggu dulu, ada juga beberapa tag pendukung yang bisa membantu kita, seperti <div> untuk mengelompokkan konten, <hr...
Read more

Belajar CSS Dasar : Mengenal CSS #01

-
Image
Apa Itu CSS? Hai, sudah siap belajar CSS? Nah, sebelum kita mulai ngoding, yuk kenalan dulu dengan CSS! Jadi, CSS (Cascading Style Sheets) adalah bahasa yang digunakan untuk mengatur tampilan dan gaya halaman web. Ibaratnya, HTML itu struktur tulang-tulangnya, dan CSS adalah baju yang bikin tampilan web kita jadi cantik dan menarik. Dengan CSS, kamu bisa mengubah warna, ukuran teks, tata letak, dan bahkan membuat animasi di halaman web. Seru, kan? Cara Menyertakan CSS: Inline, Internal, dan Eksternal Sekarang, kita masuk ke cara bagaimana CSS ini "menempel" ke halaman HTML. Ada tiga cara, yaitu inline, internal, dan eksternal. Yuk, kita bahas satu-satu biar paham. 1. Inline CSS Cara ini menulis kode CSS langsung di dalam elemen HTML. Biasanya dipakai kalau kita hanya ingin menambahkan gaya ke satu elemen saja. Cara ini praktis tapi tidak efisien kalau elemen yang ingin kita gaya lebih dari satu. Contoh code ditandai kotak hijau : ...
Read more