**CSS (Cascading Style Sheets)** adalah bahasa yang digunakan untuk **mengatur tampilan dan gaya visual** dari dokumen HTML. Jika HTML adalah kerangka rumah, maka CSS adalah interior desainer yang mendekorasi rumah tersebut. Dengan CSS, Anda dapat mengontrol warna teks, ukuran font, spasi antar elemen, tata letak halaman (misalnya, menggunakan flexbox atau grid), hingga animasi interaktif. CSS memungkinkan Anda memisahkan desain dari struktur, membuat kode lebih bersih dan mudah dikelola.
Kekuatan utama CSS terletak pada kemampuannya untuk menerapkan gaya secara konsisten di seluruh website. Anda dapat mendefinisikan aturan gaya sekali dan menerapkannya ke banyak elemen atau bahkan ke banyak halaman sekaligus. Ada beberapa cara untuk mengintegrasikan CSS ke dalam dokumen HTML, termasuk inline styling, internal stylesheets, dan external stylesheets, dengan external stylesheets menjadi praktik terbaik untuk proyek-proyek besar karena modularitas dan efisiensinya. Menguasai CSS sangat penting untuk membuat website yang tidak hanya fungsional, tetapi juga estetis dan responsif di berbagai perangkat.
Berikut adalah contoh aturan CSS untuk mengubah tampilan paragraf dan judul:
/* Mengubah warna teks dan ukuran font untuk semua paragraf */
p {
color: #333333; /* Warna abu-abu gelap */
font-size: 16px;
line-height: 1.5;
}
/* Mengatur gaya untuk judul utama */
h1 {
color: #007bff; /* Warna biru */
font-family: 'Arial', sans-serif;
text-align: center;
margin-bottom: 20px;
}
/* Membuat tombol terlihat menarik saat di-hover */
.button-primary {
background-color: #28a745; /* Warna hijau */
color: white;
padding: 10px 20px;
border-radius: 5px;
text-decoration: none;
transition: background-color 0.3s ease;
}
.button-primary:hover {
background-color: #218838; /* Warna hijau lebih gelap saat hover */
}