Cara letak image disebelah tajuk sidebar

Entri kali ini masih lagi berkaitan dengan sidebar.kalau dalam artikel sebelum ini cara meletak background dan border pada sidebar,kali ini pula cara bagaimana hendak meletak ikon disebelah tajuk pada sidebar. Dengan meletakkan ikon disebelah tajuk boleh menampakkan sedikit kelainan pada sidebar.

Bagi membuatnya:
1:Klik pada design dan pilih edit HTML

2 Cari kod ]]></b:skin> ,gunakan Ctrl + F untuk memudahkan pencarian

3.Salin kod dibawah dan letakkan sebelum kod ]]></b:skin>

.sidebar h2 {
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgGYxUq2GGFeDaFcXswAjQ0BSOYDx99NumFdQT0ajoh46TdjAE6uBvEGwgTb2Hsv4F88S9yUxKvpJfcS551FaS5de4RuxbOFUxHdI3VsCmyyfHXGwN3YOUvVWzZYOYKEuV_j9v_LeKsWEM/s1600/flower.png);
background-repeat: no-repeat;
background-position:left center;
padding:10px 50px 20px;
}

#- Gantikan url ikon jika ingin meletakkan imej yang diingini.

Imej boleh didapati dengan menggunakan google images.Boleh tentukan saiz yang dingini pada bahagian sebelah kiri menu.

Untuk membuat pelarasan ikon tukar nilai pada padding seperti contoh diatas:
padding:10px 50px 20px; ada tiga nilai dan membawa maksud seperti dibawah

10px---atas dan bawah
50px--kiri dan kanan
20px-jika ikon terlindung/terputus dihujung

selamat mencuba..


Sumber : Teknikbuatblog

Posted in: Tutorial Blog