Kenali Kode CSS Dan Kode HTML Pada Blogger Template
Kali ini kita akan bezakan antara kode CSS dan kode HTML serta kedudukannya di template. Ini penting agar kita tidak keliru antara dua jenis kode tersebut ketika membuat pengubahsuaian nanti.
Cuba perhatikan susunan kode CSS dan Kode HTML, setiap bahagian di susun mengikut susunan yang teratur. Ketika melakukan pengubahsuaian, memindahkan salah satu kode CSS (contoh: sidebar) maka kita juga harus memindahkan kode HTML sidebar mengikut kedudukan yang ada dibahagian kode CSS.
Berikut adalah kode asas CSS
body{
background: $(body.background);
}
#outer-wrapper{
width:100%;
}
#Navbar{
margin:0;
padding:0;
visibility:hidden;
display:none;
}
#header-wrapper{
width:908px;
height:200px;
}
#content-wrapper{
width:942px;
}
#sidebar-left{
width:210px;
}
#main-wrapper {
width: 360px;
}
#sidebar-right{
width:310px;
}
#footerbg{
width:923px;
height:20px;
}
Berikut adalah kode asas HTML
]]></b:skin>
</head>
<body>
<div id='outer-wrapper'>
<div id='blog-wrapper'>
<div id='header-wrapper'>
</div>
<div id='content-wrapper'>
<div id='sidebar-left'>
</div>
<div id='main-wrapper'>
</div>
<div id='sidebar-right'>
</div>
<!-- end content-wrapper -->
<div id='footerbg'>
</div>
</div> <!-- end outer-wrapper -->
Apa kaitan antara kode CSS dengan kode HTML di template?
Kode CSS adalah ibarat struktur blok. Mengubah berapa bahagian kode di CSS akan mengubah saiz serta warna latar atau background struktur blok tersebut.
Manakala kode HTML ibarat titik atau kedudukan dimana struktur blok yang telah siap diubahsuai ditempatkan. Sebagai contoh kita ingin memasang Linkbar widget dibawah header. Maka kode CSS Linkbar mestilah diletakan dibawah urutan kode CSS Header, sedangkan kode HTMLnya di letakan di bawah urutan kode HTML header.
Memahami susunan kode CSS serta kode HTML dalam blogger template adalah suatu perkara wajib bagi mereka-mereka yang sering melakukan pengubahsuaian. Semakin mendalam pengetahuan mereka dalam kode CSS dan HTML, akan lebih memudahkan mereka melakukan pengubahsuaian terhadap mana-mana jenis template.
Cuba perhatikan susunan kode CSS dan Kode HTML, setiap bahagian di susun mengikut susunan yang teratur. Ketika melakukan pengubahsuaian, memindahkan salah satu kode CSS (contoh: sidebar) maka kita juga harus memindahkan kode HTML sidebar mengikut kedudukan yang ada dibahagian kode CSS.
Berikut adalah kode asas CSS
body{
background: $(body.background);
}
#outer-wrapper{
width:100%;
}
#Navbar{
margin:0;
padding:0;
visibility:hidden;
display:none;
}
#header-wrapper{
width:908px;
height:200px;
}
#content-wrapper{
width:942px;
}
#sidebar-left{
width:210px;
}
#main-wrapper {
width: 360px;
}
#sidebar-right{
width:310px;
}
#footerbg{
width:923px;
height:20px;
}
Berikut adalah kode asas HTML
]]></b:skin>
</head>
<body>
<div id='outer-wrapper'>
<div id='blog-wrapper'>
<div id='header-wrapper'>
</div>
<div id='content-wrapper'>
<div id='sidebar-left'>
</div>
<div id='main-wrapper'>
</div>
<div id='sidebar-right'>
</div>
<!-- end content-wrapper -->
<div id='footerbg'>
</div>
</div> <!-- end outer-wrapper -->
Apa kaitan antara kode CSS dengan kode HTML di template?
Kode CSS adalah ibarat struktur blok. Mengubah berapa bahagian kode di CSS akan mengubah saiz serta warna latar atau background struktur blok tersebut.
Manakala kode HTML ibarat titik atau kedudukan dimana struktur blok yang telah siap diubahsuai ditempatkan. Sebagai contoh kita ingin memasang Linkbar widget dibawah header. Maka kode CSS Linkbar mestilah diletakan dibawah urutan kode CSS Header, sedangkan kode HTMLnya di letakan di bawah urutan kode HTML header.
Memahami susunan kode CSS serta kode HTML dalam blogger template adalah suatu perkara wajib bagi mereka-mereka yang sering melakukan pengubahsuaian. Semakin mendalam pengetahuan mereka dalam kode CSS dan HTML, akan lebih memudahkan mereka melakukan pengubahsuaian terhadap mana-mana jenis template.
Labels:
Blogger Template
Langgan:
Catat Ulasan (Atom)








11 Pandangan:
wah, terima kasih sangat2, seri
saya memang suka ubah2 kode ni
tapi biasanya main bedal je
kekadang menjadi, kekadang rosak teruk
hehe
Ada masa boleh layan ubahsuai sendiri ni seri....thanks..
Waah makin mantap aja Sahabatku Seri, artikelnya. Salam kompak selalau.
saya pun suka main gubah2 tapi hentam keromo je...
terima kasih sudi kongsi info.
Thanks for share, very nice article.
Ade special entri tuk sahabat...semoga ceria selalu.
aloh.. css html ni la benda paling pening. huhu tak paham2 dr kecik sampai ke bsar ni
yang html punya coding senang nk difahami..tp css...sampai skrg masih pening..even penah blaja dulu..adeih
Mantafff postingannya,..bisa nambah ilmu. thank you sob..
seronok ni dapat belajar css kat sini :)
Terima kasih tas artikelnya, sangat berguna bagi saya :)
Catat Ulasan