CSS How To

Ketika browser membaca sebuah style sheet, maka browser akan memformat dokumen sesuai style yang telah didefinisikan. 



Tiga Cara Menyisipkan File CSS 

Ada tiga cara untuk memasukkan sebuah style sheet: 
  • Style sheet eksternal 
  • Internal style sheet 
  • Style inline 



Style sheet eksternal

Sebuah style sheet eksternal sangat ideal bila style diterapkan pada banyak halaman. Dengan style sheet eksternal, anda dapat mengubah tampilan seluruh situs Web dengan mengubah satu file. Setiap halaman harus link ke style sheet menggunakan tag <link>. Tag <link> masuk ke dalam bagian head:


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


Sebuah style sheet eksternal dapat ditulis dalam editor teks apapun. File tersebut seharusnya tidak berisi tag html. Style sheet anda harus disimpan dengan ekstensi .css. Perhatikan contoh berikut:

style.css


hr {color:sienna;}
p {margin-left:20px;}
body {background-image:url("images/back40.gif");}



Internal Style sheet

Sebuah style sheet internal harus digunakan bila setiap dokumen tunggal memiliki gaya yang unik. Anda bisa mendefinisikan gaya internal di bagian head halaman HTML, dengan menggunakan tag <style>, seperti ini:

<head>
<style type="text/css">
hr {color:sienna;}
p {margin-left:20px;}
body {background-image:url("images/back40.gif");}
</style>
</head>


Style Inline

Style inline akan kehilangan banyak keuntungan dari style sheet dengan mencampurkan konten dengan presentasi. Untuk menggunakan style inline anda bisa menggunakan atribut style dalam tag. Atribut style dapat berisi properti CSS. Contoh ini menunjukkan bagaimana untuk mengubah warna dan margin kiri paragraf:

<p style="color:sienna;margin-left:20px">This is a paragraph.</p>

Next
 
Bagikan halaman ke sosial media
 
 
 

   Komentar Anda