CSS | Penggunaan CSS

Cascading Style Sheet adalah suatu pemrograman yang biasa digunakan oleh Front End web developer untuk mempercantik website yang mereka buat. CSS Sendiri bisa dibilang tidak terlalu sulit untuk digunakan, kita bisa mengaplikasikan CSS ke dalam Website yang akan kita buat melalui 3 metode, diantaranya adalah Inline, Internal, Dan External.

Penggunaan CSS Inline sangatlah efektif apabila kita hanya ingin menambahkan style pada 1 elemen, Contoh penggunaan CSS Inline adalah sebagai berikut;

<p style="color:red;">Inline CSS</p>

Berikutnya, Penggunaan CSS Internal juga membutuhkan waktu yang lebih sedikit apabila dibandingkan dengan penggunaan CSS secara External (External CSS), karena kita tidak perlu ngoding 2 file, Kita hanya ngoding CSS Didalam file HTML Yang telah kita buat sebelumnya. contoh penggunaan CSS Internal adalah sebagai berikut;

<!DOCTYPE html>
<html>
  <head>
    <title>CSS Internal</title>
    <!--CSS-->
    <style>
      .CSS {
        color: red;
        background-color: black;
      }
    </style>
    <!--Akhir CSS-->
  </head>
  <body>
    <h1 class="CSS">Internal CSS</h1>
  </body>
</html>

Berikutnya, Penggunaan CSS Secara External (External CSS). kelebihan menggunakan metode External CSS Adalah, file HTML Yang telah kita buat memiliki ukuran yang lebih kecil dibandingkan dengan penggunaan CSS Secara Inline maupun Internal. Disini, kita menggunakan CSS External yang mana harus menghubungkan file style.css dengan file HTML Yang telah kita buat sebelumnya. perlu diingat, letak kita menyimpan file CSS dan HTML harus berada di 1 folder yang sama. berikut adalah contohnya;

Baca Juga  Source Code Calculator with html,CSS and javascript

Isi dari file HTML yang telah kita buat sebelumnya

<!DOCTYPE html>
<html>
<head>
    <title>CSS External</title>
    <!--Tag penyambung file html dengan file CSS-->
    <link rel="stylesheet" type="text/css" href="style.css">
    <!--Akhir Tag Penyambung-->
</head>
<body>
    <h2>External CSS</h2>
</body>
</html>

Isi dari file style.css

h2 {
  background-color:black;
  color:white;
  }

Lalu kita simpan semua file kedalam 1 folder yang sama, lalu jalankan.

Terimakasih , kurang lebihnya saya mohon maaf.

Baca Juga  Apa Itu Html | Pengertian HTML
, , , , , , , , ,

Related Post

Source Code Calculator with html,CSS and javascript

August 25, 2021

Cara Menampilkan File .htaccess di file manager cpanel

April 28, 2021

Pengertian SQL dan fungsi SQL

April 29, 2021

258 Replies to “CSS | Penggunaan CSS”

  1. Great breakdown of CSS implementation methods! As someone who works with web-based gaming platforms, I can’t stress enough how external CSS improves page load speeds – crucial for retaining players. The separation of concerns you explain is fundamental for creating responsive, engaging user experiences across devices, similar to what we implement for phplay superace slot platforms.

    Reply

  4. Interesting points about responsible gaming! It’s great to see platforms like jl96 game prioritizing secure experiences & easy funding options like GCash – crucial for accessibility in the Philippines. Definitely a growing market!

    Reply

  55. Excellent explanation of CSS approaches! In developing responsive platforms like pgph88 club, external CSS proves invaluable for consistent styling across complex interfaces while maintaining performance.

    Reply

Leave a Reply

Your email address will not be published. Required fields are marked *