IMILKOM BELAJAR – #4 CSS: Apaan Tuh?

Halo Imilkomers balik lagi dengan mimin kangen ga sieh?? Nah hari ini kita bakalan lanjutin pembelajaran kita mengenai pemrograman web kemarin. Hah? Belum tau? Kunjungi dulu deh link ini terus balik lagi kesini ygy (link imilkom mengajar ) udahkah? Kalau gitu mari maju bestie.

Nah kita bakalan bahas mengenai yang namanya CSS. CSS yaa bukan GGS, Nah CSS itu adalah sebuah singkatan dari Cascading Style Sheet. Nah sesuai namanya CSS ini tuh memiliki sifat style sheet language. Dimana fungi utama CSS dalam pemrograman web pastinya adalah untuk men-design halaman web agar slay. Dalam melakukan design web tentunya kita juga mengenal penanda nya. Nah penanda disini menggunakan id dan class.

Sebelum Negara Api menyerang, maksudnya Sebelum adanya CSS, tidak ada bahasa yang dipakai untuk memberikan style pada dokumen (web). Tampilan web terasa hambar dan kurang tertata. Ide awal tentang style sheet di browser bukan sesuatu yang baru. Pada tahun 1990, Tim Berners-Lee membuat web browser bernama NeXT browser/editor.

(Illustrasi sebelum dan sesudah ada CSS)

Seperti perasaan yang mudah terbagi, penggunaan CSS ini juga terbagi dalam beberapa bagian berdasarkan letak nya CSS ini dari file HTML. Antara lain ada inline, internal, dan eksternal.

Inline Style Sheet, merupakan metode atau cara penulisan CSS langsung pada tag HTMLyang ingin diberikan style CSS. Metode ini biasanya digunakan ketika kita tidak ingin mengatur semua elemen didalam dokumen web. Metode ini sangat tidak disarankan karena akan membuat tag pada HTML akan penuh dengan attribute HTML dan membuat ukuran file pada HTML akan bertambah besar. Berikut contoh penggunaan Inline Style Sheet.

<body style="font-family: arial">
    <h1 style="background-color: red; color: white; padding:5px">Cascading Style Sheet (CSS).</h1>
</body>

Internal Style Sheet, merupakan metode penulisan CSS langsung didalam file HTML tepatnya berada diantara tag head dengan diapit tag style terlebih dahulu sebelum memulai kode CSS. Berikut contoh penggunaan Internal Style Sheet.

<html>
<head>
    <meta charset="UTF-8">
    <title>Jenis-Jenis CSS (Inline, Internal, Eksternal)</title>
    <style type="text/css">//// ini awal css nya ges
    body {font-family: arial;}
    h1 {
       background-color: red;
       color: white;
       padding: 5px;
    }
    </style>///// ini akhirnya css nya ges
</head>
<body>
    <h1>Cascading Style Sheet (CSS).</h1>
</body>
</html>

Eksternal Style Sheet, merupakan metode penulisan CSS secara terpisah denganmemberikan ekstensi .css untuk nama filenya. Metode ini sangat dinajurkan untukmenuliskan kode CSS karena kita akan dengan mudah mengubah kode yangterkumpul dalam satu file. Untuk Eksternal style file akan disematkan atau diloaddengan kode HTML seperti berikut.

<head>
    <meta charset="UTF-8">
    <title>Jenis-Jenis CSS (Inline, Internal, Eksternal)</title>
    <link rel="stylesheet" href="style.css" type="text/css">///dibuat
penempatan css nya
</head>

Nahh berikutnya kita bakalan bahas mengenai penulisan sintaks yang benar dalam CSS. Ga sabarkah?? Yuklah yuk sabi kali subscribe page kita biar kamu ga ketinggalan update dan berita dari website IMILKOM ini. Bye byeee

Comments

Leave a Reply Cancel reply