Tutorial Blog, Tips Blogging, SEO, Belajar Syntax HTML, PHP, CSS, dan Aktifitas Coding Lainnya

Mengenal External Style Sheet

Apa itu Style Sheet?


Mengenal External Style Sheet - Style Sheet bisa kita sebut semacam bungkus atau kemasan. Sesuatu bisa terlihat menarik atau tidak itu juga tergantung kemasannya. Style Sheet berisi kode style CSS yang akan menentukan kemasan suatu halaman web. Ketika browser membaca style sheet, maka itu akan memformat tampilan halaman web sesuai informasi dalam style sheet tersebut.

Ada tiga cara untuk memasukkan style sheet. Bisa dengan External style sheet, Internal style sheet, atau Inline style. Apa maksudnya? Sinahu coding akan membahasnya satu per satu.

Penggunaan External Style Sheet


External Style Sheet adalah cara untuk mendesain tampilan web dengan style CSS yang disimpan secara eksternal pada file khusus berekstensi ".css". Dengan External Style Sheet, kamu bisa mengubah tampilan seluruh situs Web hanya dengan melalui satu file saja yang sudah kita simpan khusus tadi.

File style sheet tersebut diletakkan pada elemen <link> dan ditempatkan pada bagian head. Maka akan terlihat seperti ini :


<head>
<link rel="stylesheet" type="text/css" href="styleku.css">
</head>

External Style Sheet bisa ditulis dengan editor teks apapun, misal notepad. File tidak perlu berisi tag html. Dan yang paling penting, file style sheet harus disimpan dengan ekstensi css. Sedikit contoh penulisannya seperti ini :


body {
    background-color: red;
}

h1 {
    color: blue;
    margin-left: 20px;
}

Yang perlu diperhatikan agar style yang kita tulis bisa match dan bisa diterapkan pada tampilan sesuai keinginan adalah nama selector harus sesuai dengan nama tag HTML yang kita gunakan pada web. Kalau masih bingung apa itu selector, kamu mungkin perlu Mengenal syntax kode CSS terlebih dahulu.



0 Komentar untuk "Mengenal External Style Sheet"

Back To Top