Kamis, 02 Januari 2014

kenalan sama css (2)

sekarang kita lanjutin kenalan kita dengan css, agar tampilan situs kita semakin keren. meskipun blognya sepi mlompong gak ada yang baca, yang penting situsnya gak kayak gini.

css yang di halaman kemarin sudah dibahas. ada yang diletakkan langsung di tag html, ada yang diletakkan di header. sayangnya kalau untuk di header gak bisa kita lakukan kecuali kita membuat file .html sendiri dan diupload di hosting. karena kalau kita menggunakan wordpress, yang ada di add new page atau add new post adalah body alias tag <body> kalau cssnya kita panggil dari body gak akan keluar.

pada metode css yang ketiga ini kita akan meletakkan css pada  file tersendiri, jadi semua kode css terpusat pada satu file dan kode tersebut akan dipanggil pada setiap halaman.

file css

biasanya file ini diberi nama style.css, yang penting akhirannya .css kemudian isi dengan kode sesuai desain anda. misalkan

p {                                             paragraf (<p>)
text-align:center;
font-weight:bold;
}

.merah {                                     class (class="merah")
text-align:center;
color: #F00;
font-weight:bold;
}

#biru {                                       id (id="biru")
text-align:center;
color: #00F
}


setelah itu simpan file css tersebut.

Lalu bagaimana cara memanggil style css tersebut, caranya di header <head> ditambahkan kode berikut
<head>
<link rel="stylesheet" href="style.css" type="text/css">
 </head>

setelah itu setiap kita membuat tag paragraf <p> maka stylenya akan sesuai dengan css p diatas. kalau kita ini menggabungkan anda antara style css p dengan merah, maka dapat kita tulis <p class="merah">isi paragraf </p>

misalkan di dalam paragraf kita ingin membuat tulisan tertentu menjadi merah tebal seperti css .merah, maka kita panggil style css tersebut dengan 

<span class="merah">tulisan ini warna merah</span>


Tidak ada komentar:

Posting Komentar