Pembelajaran CSS 08 Membuat Komentar

Berkomentar merupakan sebuah bentuk interaksi, hanya saja pada artikel kali ini komentar css bukanlah komentar seperti komentar pada sebuah kolom artikel ya, komentar css itu seperti sebuah tanda atau keterangan yang dibuat oleh programmer dalam menandai bahwa kode atau koding ini bertujuan untuk apa.

Misalkan kamu membuat style css yang bertujuan untuk mengatur warna, ukuran dari parafgraf, maka kamu bisa menambahkan fungsi komentar tersebut. Fungsi komentar juga pernah saya bahas pada artikel html dan tujuan fungsi komentar html dan css itu sama hanya saja cara penulisannya yang berbeda

Komentar pada kode css sangat berguna apalagi kalau kamu memiliki banyak koding css dalam 1 website. Jadi kalau script css kamu hanya 1 atau 2 mungkin tidak terlalu berdampak manfaat dari komentar ini, tapi kalau kamu tipikal yang suka cepat lupa, maka memberikan tanda keterangan komentar pada koding css kamu itu sangat membantu.

Apa sih itu komentar CSS?

Komentar atau comment adalah sebuah bagian dari kode yang tidak di eksekusi atau diproses ketika program berjalan (contohnya berjalan pada browser chrome). Sesuai dengan namanya, komentar digunakan untuk membuat catatan tentang kode tersebut.

CSS hanya mendukung 1 cara penulisan komentar, yakni diawali karakter ' /*'� dan diakhiri dengan karakter ' */ '. Pada kode css dibawah ini merupakan kode yang ada pada file berformat css contohnya style.css. Bisa juga kamu meletaknya diantara <head> </head> dengan tag <style> dan </style> menggunakan Berikut contohnya :

<head>
    <meta charset="UTF-8"> 
    <title>Alodospem | Pembelajaran CSS 08 Membuat Komentar</title>

    <style>

    /* Ini adalah style untuk paragraf */
     p {
         font-size: 18px; /* Set ukuran font sebesar 18 pixel */
         color: black; /* Membuat teks berwarna hitam */
       }

     </style>

</head>

Karena tidak akan diproses, komentar biasa digunakan untuk 'mematikan' beberapa kode CSS. Teknik ini sangat berguna ketika proses debugging (mencari kesalahan kode program), atau kita ingin mencoba-coba kombinasistyle baru, tapi tidak ingin menghapus kode lama. Berikut contoh penggunaannya:

/* dimatikan sementara
     h1 {
        font-size: 18px;
        color: black;
       } */
     h1 {
        font-size: 16px;
        color: green;
       }

Pada kode CSS yang panjang, komentar sering dimanfaatkan untuk membagi kelompok kode css, misalnya untuk bagian header, footer, menu, dll, seperti contoh berikut:

    /*======================
    ========HEADER========
    ======================*/
    .header{
    font-size: 16px;
    color: green;
    }
    /*======================
    ========FOOTER========
    ======================*/
    .footer{
    font-size: 12px;
    color: black;
    }

Dengan pembagian seperti ini, akan memudahkan untuk saya dan kamu dalam membaca dan mencari kode css karena sudah dikelompokkan menurut fungsinya masing-masing.

Kesimpulan

Dengan adanya tanda komentar membuat saya dan kamu bahkan programmer menjadi mudah dalam mencari script yang akan diubahnya untuk kedepannya, selain itu fungsi komentar juga dapat digunakan sebagai pemati kode script css yang tidak dibutuhkan sementara waktu.

Pembelajaran Selanjutnya

Pembelajaran selanjutnya akan membahas tentang cara yang benar untuk menyisipkan kode css kedalam kode html contohnya bisa langsung dimasukan pada tag <p></p> dan berbeda seperti cara diatas.