Pengantar CSS


CSS, atau Cascading Style Sheets, digunakan untuk mengubah tampilan halaman web yang dibuat dengan HTML. Berikut adalah langkah-langkah sederhana untuk memulai:

Link CSS ke HTML

Tambahkan elemen berikut di bagian <head> dokumen HTML Anda.

<head>
   <link rel="stylesheet" type="text/css" href="style.css">
</head>

Buat File CSS Terpisah

Buat file terpisah bernama style.css. Ini akan berisi aturan gaya untuk elemen HTML.

Selektor CSS

Pilih elemen HTML yang ingin Anda gayakan. Misalnya, untuk semua elemen <p>:

p {
   color: blue;
   font-size: 16px;
}

Properti CSS

Atur properti gaya seperti warna teks (color), ukuran font (font-size), dan lainnya.

Class dan ID

Gunakan class dan ID untuk merinci gaya elemen tertentu.

<p class="highlight">Ini sebuah paragraf.</p>
.highlight {
   background-color: yellow;
}

Elemen HTML Lebih Kompleks

Gaya elemen yang lebih kompleks seperti tabel atau formulir.

table {
   width: 100%;
   border-collapse: collapse;
}

input[type="text"] {
   width: 200px;
}

Pewarisan

Beberapa properti dapat diwariskan dari elemen induk ke anak-anaknya. Pahami konsep ini.

Penggunaan Warna dan Ukuran Font

Pilih warna yang sesuai dan ukuran font yang mudah dibaca.

body {
   background-color: #f4f4f4;
   font-family: 'Arial', sans-serif;
}

Ingat, ini hanya pengantar singkat. Teruslah eksplorasi untuk memahami lebih lanjut tentang CSS!