Assalamu'alaikum, apa kabar semua? semoga sehat semua ya, amin
Sekarang saya akan membahas "Memberi background pada sidebar heading". Apa itu sidebar heading? sidebar heading adalah kepala dari heading(memangnya sidebar juga punya kepala wkwkw...) yang dimaksud adalah dimana judul widget berada.
Gambar disamping adalah contoh sidebar heading yang telah diberikan background. ^_^
Berikut cara Memberi background pada sidebar heading:
1. Masuk dasbor
2. Pilih Rancangan --> edit html
3. Cari code berikut:
----------------------------------------------- */
.sidebar {
color: $sidebartextcolor;
line-height: 1.5em;
}
.sidebar ul {
list-style:none;
margin:0 0 0;
padding:0 0 0;
}
.sidebar li {
margin:0;
padding-top:0;
padding-$endSide:0;
padding-bottom:.25em;
padding-$startSide:15px;
text-indent:-15px;
line-height:1.5em;
}
.sidebar .widget, .main .widget {
border-bottom: 1px solid #99C9FF;
margin:0 0 1.5em;
padding:0 0 1.5em;
}
4. Lalu paste code berikut setelah code diatas
/* sidebar heading */
#sidebar h2 {
padding: 6px 0 6px 7px;
text-align: justify;
color: #ffffff;
font: normal bold 98% Arial, sans-serif;
text-transform: uppercase;
text-decoration: none;
background-image:url("http://i45.tinypic.com/3320w06.gif");
background-repeat:repeat-x;
background-position:center right;
border-bottom: 1px solid #99C9FF;
-moz-border-radius-topleft: 10px;
-moz-border-radius-topright: 10px;
-webkit-border-radius-topleft: 10px;
-webkit-border-radius-topright: 10px;
-khtml-border-radius-topleft: 10px;
-khtml-border-radius-topright: 10px;
border-top-left-radius: 10px;
border-top-right-radius: 10px; }
border:2px solid #E8EDFB;
}
5. Save/Simpan
Note:
*Code yang bewarna merah adalah url gambar background
*Code yang dicari kemungkinan berbeda jika tidak ada cari yang hampir mirip
Perkembangan Beton Bertulang Yang Unik Baik Secara Eksperimental Maupun
Secara Praktek Langsung Dilapangan
-
PERKEMBANGAN BETON BERTULANG YANG UNIK BAIK SECARA EKSPERIMENTAL MAUPUN
SECARA PRAKTEK LANGSUNG DILAPANGAN Pada saat ini desain struktur konstruksi
tahan...
19 komentar :
wahh sob mantep nih keep posting ya..
mantap sob..kalo ane sih kurang suka memberi background pada sidebar...
joos banget tutornya.. hehehe
mantab
Terima kasih tutorialnya, bisa membuat blog lebih indah dilihat
Salam ukhuwah
salam sahabat
perlu dipraktekkan makasih ya
posting ini sgt membantu sy dlm mengingat html dasar..dg memberi background tampilannya akan lebih bagus lagi.. siip :)
makasih, nanti saya mau coba
berkunjung.....
Nice posting..Ane coba dulu Sahabat.
Izin follow this blog,follow balik za... ^_^
Ini yang saya cari.Thank's sharingnya.
Tutoril yang mantab
SUKSEL(SUKSES SELALU),he..he..
Mantep Kawan Cuman mainin CSS ^^
Weleh-weleh... makin mantab aja nih tutorial di blog ini. Sips kang kalau aku lagi butuh ni trik lagsung kesini..
Dengan memberi hiasan biground tampilan blog menjadi lebih cantik dan enak dipandang sehingga membuat pengunjung akan puas
kalau say agk suka yang beginian kang, ini kan sidebar andalannya ardi :D, , saya lebih suka yang Teks dan Bergaris bawah
Wah..wah...wah... ga bosen2 nih ngebagusin blog jdinya...hehe Tipsnya keren2 nih,, makasih banget... :)
wah...keren nih...
saya coba dulu...
wah, keren nih sob...mau dicoba ahh...
thanx ya infonya. visit my blog.
Posting Komentar