Belajar CSS Part 2
Belajar CSS 2 ini adalah tentang id CSS dan class CSS. Id CSS digunakan untuk menentukan style dari elemen yang unik. Id selector menggunakan atribut id elemen dan didefinisikan dengan “#” html. Sebagai contoh aturan id dibawah ini akan diaplikasikan pada id elemen “belajar CSS Part 1” :
#Belajar 1
{
text-align:center;
color:red;
}
CSS juga mengijinkan kita untuk menyatukan elemen-elemen html secara bersamaan didalam sebuah kelas (classes) dan menerapkannya aturan Style-Sheet kedalam sebuah class CSS. Selector class CSS menggunakan atribut html dan didefinisikan dengan “.”Pada contoh di bawah, semua elemen HTML dengan class = “center” akan menjadi center-aligned:
center {text-align:center;}
Anda juga bisa menentukan hanya pada elemen html khusus yang akan dibuat class CSS, Pada contoh di bawah, semua elemen p dengan class = “center” akan menjadi center-align :
p.center {text-align:center;}
Satu dari beberapa kehebatan tekhnologi css ini adalah memperbolehkan kita untuk mendefinisikan sebuah style-sheet global yang dapat menerapkan aturan-aturan css tersebut untuk keseluruhan dokumen-dokumen HTML pada halaman web site anda. Jadi jika anda ingin merubah tampilan situs anda tinggal mengedit satu file saja. Maka jangan ragu-ragu untuk terus belajar CSS.
kita lanjutkan tentang bagaimana cara kode css ke dalam situs kita. Ada 3 jalan untuk memasukkan style sheet yaitu external style sheet, internal style sheet dan inline style.
External sheet ideal diaplikasikan pada banyak halaman. Setiap halaman harus link ke style sheet menggunakan tag <link>. Tag <link> masuk ke dalam bagian head:
<head>Style sheet eksternal dapat ditulis dalam editor teks apapun. File tersebut seharusnya tidak berisi tag html. Style sheet Anda harus disimpan dengan ekstensi CSS Seperti contoh di bawah ini:
<link rel="stylesheet" type="text/css" href="mystyle.css" />
</head>
Hr {color:sienna;}
p {margin-left:20px;}
body {background-image:url("images/back40.gif");}Internal style sheet digunakan pada dokumen tunggal yang unik. Kita mendefinisikan internal style pada head dalam halaman html menggunakan <style> seperti contoh dibawah ini :
<head>
<style type="text/css">
hr {color:sienna;}
p {margin-left:20px;}
body {background-image:url("images/back40.gif");}
</style>
</head>
Sedangkan untuk menggunakan Inline style kita dapat menggunakan atribut style yang dalam tag yang relevan. 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>
Terima Kasih Anda Telah Membaca Artikel Tentang Belajar CSS Part 2 CSS ID dan CSS CLASS Dan Anda Bisa Menemukan Artikel Belajar CSS Part 2 CSS ID dan CSS CLASS Ini Dengan Url Belajar CSS Part 2 CSS ID dan CSS CLASS. Anda Boleh Menyebarluaskan Atau Mengcopy Artikel Belajar CSS Part 2 CSS ID dan CSS CLASS Ini Jika Memang Bermanfaat Bagi Anda Atau Teman-teman Anda, Namun Jangan Lupa Untuk Mencantumkan Link Sumbernya.
0 komentar:
Post a Comment