Selamat Datang Diucapkan Kepada Semua Pengunjung Blog Ini Segala Komen Dan Saranan Teman Teman Amat Seri Hargai

Kode CSS Yang Perlu Kita Ketahui

Sebelum seri melanjutkan siri Modifikasi Template, adalah lebih baik kita memahami dulu berapa dasar kode yang ada dalam Kode CSS Template. Ini kerana tutorial yang akan datang banyak berkaitan dengan berapa kode CSS yang akan seri terangkan di bawah.

Sila rujuk gambar di bawah untuk mengikuti tutorial selanjutnya mengenai Kode CSS. Kita mulakan tutorial ini dari bahagian luar.


Margin
Merupakan ukuran jarak bahagian luar sesudah Border. Lebih tepat Margin digunakan untuk menjarakkan antara dua komponen. Margin tidak mempunyai warna latar dan tranparen sepenuhnya.

Contoh margin serta cara penggunaannya;

margin-top:100px;
margin-bottom:100px;
margin-right:50px;
margin-left:50px;

Margin juga boleh ditulis dalam bentuk singkat;

margin:25px 50px 75px 100px;
margin atas ialah 25px
margin kanan ialah 50px
margin bawah ialah 75px
margin kiri ialah 100px

margin:25px 50px 75px;
margin atas ialah 25px
margin kanan dan kiri ialah 50px
margin bawah ialah 75px

margin:25px 50px;
margin atas dan bawah ialah 25px
margin kanan dan kiri ialah 50px

margin:25px;
keseluruhan margin ialah 25px

Border
Garisan atau sempadan yang terletak di sekitar padding dan konten. Kita boleh tentukan ketebalan sempadan serta jenis warna mengikut kesesuaian.

Contoh border;

border:2px solid #000000;
2px solid - 2px ialah nilai ketebalan border manakala solid ialah jenis border yang digunakan.
#000000 - Warna border

Jenis-Jenis Border Yang Sering Digunakan;

dashed, solid, double, groove, dotted

Padding
Padding menentukan jarak antara border dan bahagian dalam (konten). Ia dipengaruhi oleh warna latar konten.

Contoh padding serta cara penggunaannya;

padding-top:25px;
padding-bottom:25px;
padding-right:50px;
padding-left:50px;

Sama seperti margin, padding juga boleh ditulis dalam bentuk singkat;

padding:25px 50px 75px 100px;
padding atas ialah 25px
padding kanan ialah 50px
padding bawah ialah 75px
padding kiri ialah 100px

padding:25px 50px 75px;
padding atas ialah 25px
padding kanan dan kiri ialah 50px
padding bawah ialah 75px

padding:25px 50px;
padding atas dan bawah ialah 25px
padding kanan dan kiri ialah 50px

padding:25px;
keseluruhan padding ialah 25px

Content
Isi kotak, dimana teks atau gambar muncul.

Kepada para blogger, selamat belajar kerana modifikasi template amat penting agar kita tidak bergantung sepenuhnya kepada template-template yang banyak di internet.

Memodifikasi template sendiri mempunyai banyak kelebihan. Kita boleh membuat mengikut citarasa sendiri selain mengelakkan dari kode-kode yang tersembunyi jika kita mengunakan template dari internet.

9 Pandangan:

Yastro April 26, 2011  

setuju ngan seri, modipied template sendri byk dpt kelebihan...tp tak tau la bila nak godek2...mungkin bila guna hosting sendiri nti kot bru nak mengelabah...

tehr April 27, 2011  

saya suka dengan css ni
tapi selalunya main hentam kromo je
hari ni baru faham mengenai atas bawah kiri kanan tu
haha

thanks sangat2

Admin April 28, 2011  
Ulasan ini telah dialihkan keluar oleh pengarang.
~~su manje~~~ Mei 01, 2011  

assalamualaikum wbth seri...
selamat hari buruh sumanje ucapkan...

Cerita Aku Mei 01, 2011  

menarik sgt...tp sy masih baru...masih belum faham. Jemput baca enovel terbaru saya Suhana Karissa di blog cerita aku ya..

tokwan muda Mei 01, 2011  

Penat berjalan ke blog kawan,
Rehat sebentar menjenguk Seri,
Tokwan datang membalas kunjungan,
Mencari ilmu di blog ini.

salam ukhwah^_^

Yastro Mei 03, 2011  

sori tulih sini jer..s/mix tu dh kene block lak kt opis nih....huhuhu

Kang Fatur Mei 03, 2011  

sebagai pengrajin dsain template ikutan nyoret disini aah

Tanpa Nama,  Mei 04, 2011  

mantab... visit me back.... :) salam kenal :D

Teman Setia

This Blog Is Proudly Sponsored By SURF7 Template Modified By Seri Bahasa Proud To Be A Kinabatangan Blogger