-->
 
Ganti background posting dengan gambar

BERANDAARCHIVEQUR'ANYASINTAHLILAMALAN

     
Mengganti background area postingan dengan gambar dan animasi 
Berikut langkahnya ;


1.Login Ke akun blog sobat
2.Pilih Rancangan/Tata Letak---> Edit HTML
3.Cari Kode  ]]></b:skin>  (gunakan ctrl f atau F3 agar memudahkan pencarian)
4.Letakan Kode dibawah ini Tepat Diatas Kode ]]></b:skin>

.post{border-radius:10px;background:url(http://4.bp.blogspot.com/_O84nraTVNhw/TTVkjpb4VvI/AAAAAAAAALs/yE_Q-eIWMW4/s1600/background-judul-posting.gif) no-repeat center;background-size:100% 100%;border:1px solid #f00;
} /* silahkan di edit stylenya sesuai selera*/
.post:hover{-moz-box-shadow:0 0 70px #F80505;-webkit-box-shadow:0 0 70px #F80505;box-shadow:0 0 40px #F80505;
} /*memberikan efek saat dicursor*/


5.Simpan Templatenya Dan Lihat Hasilnya

6.Note untuk kode background-size, penggunaannya tergantung pada lebar dan besar gambar, apabila background-size:100% 100%; berarti background penuh tidak mengulang. untuk posisi, apabila background pengen mengulang gunakan kode repeat-center,(ada beberapa pilihan posisi background seperti fixed dll). untuk lebih jelasnya lakukan eksperimen sendiri.

Kode url warna biru bisa anda ganti dengan url gambar and, dan kode-kode warna silahkan di edit sesuai warna kesukaan anda.
selamat mencoba..
Artikel Terkait :
  1. About Sitelink
  2. Add Emoticon On Thread Comments
  3. Animasi Link With CSS
  4. Animasi Loading Blog
  5. Animated Window Opener
  6. Auto Image Zoom With CSS Ease-Out
  7. Blogger Logo With CSS
  8. CSS Drop Down Multi Sub Menu
  9. CSS Left Flayout Menu
  10. CSS Left Rocket Dock Menu
  11. CSS Menu Drop Down
  12. CSS Menu Drop Down Melayang
  13. CSS Menu Horisontal
  14. CSS Menu Pull Up Multi Sub Menu
  15. CSS Page Peel Effect
  16. CSS Popup Image Viewer
  17. CSS Red Menu Horisontal
  18. CSS Right Flayout Menu
  19. CSS Sidebar Slide Menu
  20. CSS Slide Table Content
  21. CSS Smart Image Enlarger
  22. CSS Text Shadow
  23. CSS Transform Text Shadow
  24. CSS Zoom Menu Drop Down
  25. CSS3 Gradient Menu Buttons
  26. Cara Membuat Spoiler Pada Blog
  27. Cara Ganti Posting Lebih Baru-Lama-Beranda
  28. Cara Kompres CSS dan Mempercepat Loading Blog
  29. Cara Mebuat Daftar Isi Model Scroll
  30. Cara Memasang File Swf diBlog
  31. Cara Memasang Meta Tag Google
  32. Cara Memasang Meta Tag Yahoo
  33. Cara Memasang Widget Profil twiter
  34. Cara Memasang Widget Read More Otomatis
  35. Cara Membuat Animasi Menu Pull Up
  36. Cara Membuat Artikel di Blog
  37. Cara Membuat Background Postingan Berubah Warna
  38. Cara Membuat Blogazine Post
  39. Cara Membuat Border Area Posting
  40. Cara Membuat Browser Blog Bergerak Liar
  41. Cara Membuat Drop Cap
  42. Cara Membuat Garis Tepi Pada Latar Posting
  43. Cara Membuat HTML Blog Valid
  44. Cara Membuat Judul Posting Berjalan
  45. Cara Membuat Kursor Bertabur Bintang
  46. Cara Membuat Link Bergoyang Bila di Cursor
  47. Cara Membuat Link Seperti Pelangi
  48. Cara Membuat Link Terbuka di Tab Baru
  49. Cara Membuat Menu Info Slide
  50. Cara Membuat Navigasi Chunky
  51. Cara Membuat Recent Comment
  52. Cara Membuat Recent Post Slide Show
  53. Cara Membuat Screensaver Di Blog
  54. Cara Membuat Tag Cloud / Label Cloud
  55. Cara Membuat Tanda Tangan di Bawah Posting
  56. Cara Membuat Tulisan atau Iklan Berjalan
  57. Cara Menampilkan Navbar Blogger Auto Hide
  58. Cara Mengambil Screenshoot
  59. Cara Menonaktifkan Klik Kanan Pada Blog
  60. Cara Pasang Anti Copy Paste
  61. Cara memasang Lencana Profil Facebook di Blog
  62. Cara membuat menu tab Drop Down Horizontal
  63. Cara membuat judul postingan berkedip
  64. Create Fixed Widget Sponsor
  65. Cursor Style
  66. Custom Tabel
  67. Disable Open Source
  68. Easy Loading Blog - New !!
  69. Expand Image Script
  70. Facebook Logo With CSS
  71. Fonts Keren Buat Blog
  72. Free Web Hosting
  73. Ganti background posting dengan gambar
  74. HTML Card Icons
  75. Hapus Navbar Secara Permanen
  76. JS Page Peel Effect
  77. Macam - macam Border
  78. Macam - macam Spoiler
  79. Magnify Image Zoom
  80. Memasang Ikon Didepan Judul Posting
  81. Memasang Ikon didepan Label
  82. Memberi Background Pada Post Comment
  83. Memberi Efek Bersinar Pada Kotak Komentar
  84. Membuat Scroll pada Arsip Blog dan Label
  85. Membuat Efek Blur Otomatis
  86. Membuat Efek Bersinar di Sekitar Elemen
  87. Membuat Efek Blur Pada Gambar
  88. Membuat Link Mengeluarkan Cahaya Kuning
  89. Membuat Link Terbuka Otomatis Bila DiCursor
  90. Membuat Link mengeluarkan Bintang Saat di Mouse
  91. Membuat Menu Navigasi Breadcrumbs pada Blog
  92. Membuat Menu Slide Out Navigation
  93. Membuat Sidebar Dalam Kotak Terpisah
  94. Membuat Tab Menu View Tanpa Edit HTML
  95. Membuat Tombol Home Back To Top Dan Bottom
  96. Membuat Tombol Reply pada Komentar
  97. Membuat Widget Follower Melayang
  98. Membuat Widget Hanya Tampil di Beranda
  99. Membuat gambar menjadi besar bila dilalui Cursor
  100. Mempercepat Loading Blog Dengan Script
  101. Menambahkan Recent Post dan Recent Comment
  102. Menampilkan Hanya Judul Posting di Beranda
  103. Menghapus Show All Post atau Show Older Post
  104. Menghilangkan Attribute Powered by Blogger
  105. Mengintip Design HTML Template Blog
  106. Menu Drop Up Melayang
  107. Merubah Tampilan Kotak Pencarian
  108. Modifikasi Spoiler Button
  109. Neon Light Text Animmator
  110. Read More Dengan icon
  111. Show Hide Comments With JS
  112. Show Hide Komentar Dengan Spoiler
  113. Simple Animasi Link
  114. Slide Out Komentar
  115. Slide Out Sidebar Content
  116. Slideshow Image Background
  117. Submit Sitemap Blog ke Google
  118. Tips Mendapatkan Backlink Gratis
  119. Tooltip Untuk Setiap Link Dengan Gambar
  120. Translucent Slideshow Script
  121. menghilangkan angka jumlah label postingan
  122. tips membuat logo
Posted On : 24 Agustus 2011 Time : 23.36
SHARE TO :
| | Powered By : C.(BH-elatos) | Copyright By : cuerosbhelatos | |