1. CSS Inline
Apa itu CSS Inline ? CSS Inline adalah sebuah metode penerapan CSS pada HTML. Cara penerapan nya adalah dengan menuliskan langsung codingan Css pada tag Html. Berikut ini adalah contoh codingan nya.
<!DOCTYPE html> <html> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title> CSS Inline </title> </head> <body> <h1 style="color: red;"> Selamat Datang di Blog Nusa Pixel Digital </h1> <p style="background-color:blue;color:yellow;"> Ini Merupakan Contoh CSS Inline </p> </body> </html>
Apa itu CSS Internal ? CSS Internal adalah sebuah metode penerapan CSS pada HTML yang cara penggunaan nya adalah dengan menuliskan codingan CSS di dalam tag <head>. Berikut ini adalah contoh codingan nya
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title> CSS Internal </title>
<style>
.green {color:green;background-color:black;}
.blue {color:red;background-color:blue;}
</style>
</head>
<body>
<h1 class="green"> Selamat Datang di Blog Nusa Pixel Digital </h1>
<p class="blue"> Ini Merupakan Contoh CSS Internal </p>
</body>
</html>
Apa itu CSS Eksternal ? CSS Eksternal adalah sebuah metode penerapan CSS pada HTML yang cara penggunaan nya adalah dengan cara menuliskan codingan CSS nya di file yang berbeda. Jadi untuk menggunakan cara ini, langkah pertama nya adalah membuat file CSS nya dan menuliskan codingan CSS pada file CSS nya. Untuk file CSS nya kita simpan dengan format .css. Berikut ini adalah contoh codingan css nya
.blue {color:gray;background-color:yellow;}
.black {color:blue;background-color:black;}
.link {text-decoration:none;}
<link href="style.css" type="text/css" rel="stylesheet">Untuk yang style.css bisa kamu ubah sesuai dengan nama file css yang barusan kamu buat. Berikut ini adalah contoh codingan Html nya
<!DOCTYPE html> <html> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title> CSS Eksternal </title> <link href="style.css" type="text/css" rel="stylesheet"> </head> <body> <h1 class="black"> Selamat Datang di Blog <a class="link" href="https://nusapixeldigital.my.id/">Freeze Gans</a> </h1> <p class="blue"> Ini Merupakan Contoh CSS Eksternal </p> </body> </html>