The My Project

Beranda
CSS

CSS | BAB 1 Pengenalan CSS

 


Apa itu CSS?

CSS (Cascading Style Sheets) adalah bahasa pemrograman yang digunakan untuk mengatur tampilan dan gaya elemen-elemen dalam halaman web. CSS memisahkan tampilan dari struktur HTML, sehingga memungkinkan pengembang web untuk mengatur gaya dan tata letak halaman secara terpisah.

Keuntungan menggunakan CSS
  1. Pemisahan Tampilan dan Struktur: CSS memungkinkan pemisahan antara tampilan dan struktur halaman web. Ini berarti Anda dapat mengubah tampilan halaman tanpa harus mengubah struktur HTML yang mendasarinya. Hal ini mempermudah pemeliharaan dan pengembangan yang lebih fleksibel.
  2. Konsistensi: Dengan CSS, Anda dapat menerapkan gaya yang konsisten pada seluruh situs web. Misalnya, Anda dapat membuat gaya yang sama untuk semua tautan atau semua judul halaman. Ini membantu menciptakan kesan visual yang seragam dan profesional.
  3. Penghematan Waktu dan Usaha: CSS memungkinkan Anda untuk mengubah tampilan dan gaya halaman web secara global. Dengan hanya mengubah beberapa baris kode CSS, Anda dapat mengubah tampilan seluruh situs web. Ini menghemat waktu dan usaha, terutama pada situs web yang lebih besar.
  4. Fleksibilitas: CSS memberikan fleksibilitas yang lebih besar dalam mengatur tampilan halaman web. Anda dapat mengontrol ukuran, warna, jarak, dan banyak aspek visual lainnya dengan lebih mudah menggunakan CSS. Anda juga dapat membuat tata letak yang responsif dan mudah disesuaikan dengan perangkat yang berbeda.
Cara menggunakan CSS dalam HTML

Cara menggunakan CSS dalam HTML adalah dengan menambahkan kode CSS ke dalam elemen atau menggunakan file CSS eksternal yang dihubungkan dengan tag . Berikut adalah contoh penggunaan CSS dalam HTML menggunakan elemen : 

  <html>
<head>
  <title>Contoh Penggunaan CSS</title>
  <style>
    /* Kode CSS di sini */
    body {
      font-family: Arial, sans-serif;
      background-color: #f2f2f2;
    }
    h1 {
      color: blue;
      text-align: center;
    }
    p {
      color: green;
      font-size: 18px;
    }
  </style>
</head>
<body>
  <h1>Selamat Datang</h1>
  <p>Ini adalah contoh penggunaan CSS dalam HTML.</p>
</body>
</html>

Dalam contoh di atas, kita menambahkan elemen di dalam elemen untuk menuliskan kode CSS. Kode CSS tersebut mengatur tampilan elemen-elemen dalam halaman, seperti font, warna, dan tata letak.