Oke seperti janji saya kemarin, kita akan membahas lebih di priyoritaskan mana internal CSS atau eksternal CSS, sebelumnnya bagi teman-teman yang baru saja bergabung saya akan mengulang sebentar, internal css dan eksternal css ini masuk dalam cascade ya teman-teman, dan apa itu cascade, cascade adalah aturan penulisan style di dalam CSS. Oke teman-teman untuk mengetahui lebih lanjut simak terus ya.
Oke langsung saja kita masuk dalam contoh penulisan struktur CSSnya untuk mengetahui lebih di priyoritaskan mana internal CSS atau eksternal CSS. perhatikan kode berikut ini:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Belajar CSS</title>
<link href="style_cascading.css" rel="stylesheet">
<style>
p{
color: blue;
}
p{
color: red;
}
</style>
</head>
<body>
<h2>Belajar CSS</h2>
<p>Paragraf ini akan berwarna merah? hijau? biru?</p>
</body>
</body>
</html>
Struktur kode di atas saya menggunakan external style dan internal style untuk ‘mewarnai’ tag <p>. Dari urutan prioritas, external style dan internal style memiliki kekuatan prioritas yang sama. Oleh karena itu aturan “Last rules apply” akan berlaku. Oiya untuk file eksternalny sendiri saya buat isiny seperti ini:
File external CSS: style_cascading.css sendiri hanya berisi 1 property:
p {
color: green;
}
Namun karena tag <style> (dari internal style) berada dibawah tag <link> (dari external style), maka internal style-lah yang akan menang (paragraf berwarna merah). Bagaimana jika penulisannya dibalik?
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Belajar CSS</title>
<style>
p{
color: blue;
}
p{
color: red;
}
</style>
<link href="style_cascading.css" rel="stylesheet">
</head>
<body>
<h2>Belajar CSS</h2>
<p>Paragraf ini akan berwarna merah? hijau? biru?</p>
</body>
</body>
</html>
Seperti yang terlihat, kali ini paragraf akan berwarna hijau, yang berasal dari external style CSS. Hal ini juga membantah anggapan bahwa internal style akan didahulukan daripada external
style, dimana yang sebenarnya terjadi adalah Last rules apply. Apa yang kita bahas disini terlihat cukup sederhana. Tetapi ketika anda sudah mulai membuat puluhan atau bahkan ratusan selector, efek cascading harus diperhatikan.
Dengan memahami konsep cascading, kita bisa merencanakan cara menulis kode CSS. Apakah itu menggunakan external style, internal style, maupun inline style. Yang perlu diperhatikan
adalah inline style hampir selalu menang. Oleh karena itu, sedapat mungkin gunakan external style atau internal style CSS. Sudah menemukan jawabannya ya teman-teman mengenai lebih di priyoritaskan mana internal CSS atau eksternal CSS. terimakasih dan sampai jumpa.
The post Lebih di priyoritaskan Mana Internal CSS atau Eksternal CSS appeared first on Kursus Website Terbaik.