Share

MENGENAL CSS

by ibnud5506@gmail.com · 20/08/2025

INI ADALAH PEJELASAN DENGAN CARA YANG CUKUP MUDAH DI MENGERTI

Apa itu CSS?

CSS adalah singkatan dari Cascading Style Sheets.

Kalau HTML dipakai untuk membuat kerangka atau struktur halaman web, maka CSS dipakai untuk menghias dan mengatur tampilan halaman tersebut.

Bayangkan HTML itu seperti tulang dan daging dari tubuh manusia, maka CSS adalah baju, gaya rambut, dan warna kulitnya — semua yang membuat tampilannya menarik.


Untuk Apa CSS Digunakan?

CSS digunakan untuk mengatur:

  • Warna teks dan latar belakang
  • Ukuran dan jenis font
  • Jarak antar elemen
  • Tata letak halaman (misalnya posisi kolom dan baris)
  • Animasi dan efek saat kursor diarahkan ke elemen

Contoh HTML + CSS:

<!DOCTYPE html>
<html>
  <head>
    <title>Contoh CSS</title>
    <style>
      body {
        background-color: #f0f0f0;
        font-family: Arial, sans-serif;
      }

      h1 {
        color: blue;
        text-align: center;
      }

      p {
        color: #333;
        font-size: 18px;
      }
    </style>
  </head>
  <body>
    <h1>Halo Dunia!</h1>
    <p>Ini paragraf dengan gaya CSS.</p>
  </body>
</html>

Penjelasan Singkat:

  • <style> → Tempat menuliskan kode CSS (bisa juga di file terpisah).
  • body → Mengatur latar belakang dan font seluruh halaman.
  • h1 → Mengatur warna dan posisi teks judul.
  • p → Mengatur warna dan ukuran teks paragraf.

Jenis Penulisan CSS

  1. Internal CSS: Ditulis langsung di dalam file HTML (di bagian <style> seperti contoh di atas).
  2. External CSS: Disimpan di file terpisah (biasanya berekstensi .css), lalu dihubungkan ke HTML.
  3. Inline CSS: Ditulis langsung di dalam tag HTML (biasanya tidak disarankan karena sulit dirawat).

Contoh inline:

<p style="color:red;">Ini teks berwarna merah.</p>

Kesimpulan

CSS membuat halaman web terlihat cantik, rapi, dan menarik.
Tanpa CSS, halaman web hanya akan terlihat polos.

Kalau HTML adalah apa yang ditampilkan, CSS adalah bagaimana tampilannya.


You may also like