Salah satu mangfaat pengunaan heading/judul ialah untuk mempermudah dalam menentukan sebuah topik. Pada html sendiri heading ini mempunyai tingkatan dan ukuran tertentu, mulai dari h1 sampai h6.
Dan secara default dalam template Minima Standar , pengaturan untuk tag heading h2 di atur secara umum ( inheritance= pewarisan property ), artinya ketika kita mengunakan h2 untuk konten dan untuk judul sidebar maka keduanya akan terlihat sama. dengan mengunakan script css di bawah.
/* Headings----------------------------------------------- */
h2 {
margin:1.5em 0 .5em;
font:$headerfont;
line-height: .4em;
text-transform:uppercase;
letter-spacing:.2em;
color:$sidebarcolor;
}
Nah jika kita ingin mengunakan pengaturan h2 antara konten dan judul sidebar berbeda, maka caranya membuat h2 untuk sidebar secara khusus dengan menambahkan selector ID dan property-value .
contohnya seperti ini.
#Sidebar-Wrapper h2 { property:value}
dengan begitu maka h2 untuk sidebar mempunyai aturan sendiri.
Sedangkan jika ingin membuat h2 mempunyai sifat yang lebih khusus lagi pada sebuah judul widget , maka yang perlu di ketahui dulu adalah nama widget dan Id nya.
contoh jika LinkList h2 untuk sidebar sama mengunakan font tebal dan berwarna hitam seperti ini.
* LinkList1 h2.
BlogKawan Satu
* Lisklist2 h2.
BlogKawan Dua
* Linklist3 h2.
BlogKawan Tiga
ket : LinkList1,LinkList2,Linklist3 merupakan nama widget/gadget yang memiliki sebuah ID ( digunakan untuk tag secara individual dan spesifik, maka untuk penulisannya dalam Css di awali dengan tanda pagar [ # ] ) .
Dan jika saya ingin menampilkan BlogKawan Dua dengan hurup berwarna merah maka penambahkan pada halaman css-nya seperti ini.
#LinkList2 h2 { font-weight;Bold;color;red}
BlogKawan Dua
Otre selain dengan cara di atas, ada lagi cara untuk membuat heading/judul untuk sidebar berbeda satu sama lain, cara ini sering di sebut juga inline style sheet.
pertama centang/tandai di samping tulisan Expand Widget Templates.
kemudian cari tag html h2 yang ingin kita edit atau ingin di atur secara individual. .
<h2><data:title/></h2>
dan tambahkan script seperti ini .
<h2 style="background:......; padding:.....; border:....."><data:title/></h2>
contohnya saya mengunakan inline style berupa border-top untuk h2 dengan warna yang berbeda-beda di blog ini.
0 komentar:
Post a Comment
saran, komentar dan kritikan anda sangat berharga buat saya, terima kasih.