in

Metode metode penulisan di css

Berjumpa lagi sama jutsu coding . Jadi kali ini saya akan share menyenai metode metode penulisan di css  . Di css ada 3 penulisan , yaitu embedded style sheet , inline style sheet , dan yang terakhir adalah external style sheet . Baik saya akan jelaskan dan kasih contoh pada masing masing metode css .

1. inline style sheet

Yang pertama yang saya akan bahas adalah inline style sheet . Jadi inline style sheet ini yang langsung pada tah htmlnya . Jadi kita gunakan dengan atribut style . Contoh penulisan css dengan inline style sheet .

<!doctype HTML>
<html>
<head>
<title>inline style sheet</title>
</head>
<body>
<a href=”#”style=”font-size:20px;color:red;”>ini adalah contoh inline style sheet</a>
</body>
</html>

2. embedded style sheet

Jadi emmbedded style sheet ini , ditulis langsung di bagian tag <head> dan menggunakan tag <style> untuk menulis css . Contoh penulisan css dengan embedded style sheet .

<!doctype HTML>
<html>
<head>
<title>embedded style sheet</title>
<style>
a{
font-size:30px;
color:green;
background-color:blue;
}
</style>
</head>
<body>
<a href=”#”>ini adalah contoh embedded style sheet</a>
</body>
</html>

3. external style sheet

External style sheet ini jadi kita menggunakan 2 buah file yang pertama adalah html dan yang kedua adalah css . Jadi dengan external style sheet ini script kita akan menjadi lebih rapih , karena file yang satu di khusus kan untuk html saja dan yang kedua untuk css saja . Karena filenya terpisah antara html dan css jadi kita hubungakan menggunakan tag <link> atau bisa juga di import menggunakan @ import . Biar gak pusing langsung saja coba contoh mengguankan external style sheet .
petama kita buat dulu file css , simpan dengan nama style.css.

a{ font-weight:bold; font-family:arial; background-color:yellow; color:pink;}
lalu kita buat file html , simpan dengan nama css.html
<!doctype HTML><html><head> <title>external style sheet</title> <link rel=”stylesheet” type=”text/css” href=”style.css”></head><body><a href=”#”>ini adalah contoh external style sheet</a></body></html>
Selain menghubungkan dengan cara 
<link rel=”stylesheet” type=”text/css” href=”style.css”>
bisa juga dengan <style type=”text/css”> @import “style.css”; </style>
Itu dia ketiga cara untuk penulisan css . Semoga menambah wawasan dan juga bermanfaat . Terimakasih telah berkenan membaca artikel ini . Sampai jumpa di artikel yang lainnya .

Written by Bago Cyber