Tutorial Buat Kotak Blockquote

Setelah sekian lama tak edit blog dan juga buat tutorial, kali ni ina nak ajar korang  buat kotak Blockquote. Pada yang tak tahu apa Blockquote, korang boleh tengok contoh dibawah..


Untuk mengunakan Blockquote korang mesti tekan “ untuk mendapat kan hasil nya

1.       Design > Edit Html > Template Design > Advance > Add css
2.       Copy dan paste code dibawah
.post blockquote {
 background:  #FFF380  ;
-moz-border-radius-topleft: 10px;
-moz-border-radius-bottomright: 10px;
padding: 6px;
Border: 1px solid #000000;
margin:1em 20px;
}
Purple: warna untuk background..korang boleh tukar warna mengikut citarasa korang, code warna korang boleh tengok kat sini

Merah: garisan untuk border

solid : (___________)
dotted : (................)
dashed : _ _ _ _ _ _ _ )

hijau: warna kotak kotak blockquote

Kalau nak gantikan dengan gambar sila replace code background: #FFF380; dengan code ini
background-image:url(URL GAMBAR BACKGROUND BLOCKQOUTE); contoh seperti dibawah:-

.post blockquote {
 background: url (URL Image korang) ;
-moz-border-radius-topleft: 10px;
-moz-border-radius-bottomright: 10px;
padding: 6px;
Border: 1px solid #000000;
margin:1em 20px;
}
      3.  Save 

http://25.media.tumblr.com/tumblr_l8n4cjiqwU1qcdtsho1_250.gif

 
http://www.sadmuffin.net/cherrybam/myspacelayouts/polkadots/29.gif
 
http://30.media.tumblr.com/tumblr_l8lvn7YIsb1qcdtsho1_400.jpg 
http://content.mycutegraphics.com/backgrounds/color/colorbg25.gif 
 http://content.mycutegraphics.com/backgrounds/color/colorbg25.gif
Tiny Colorful Dots Background
http://content.mycutegraphics.com/backgrounds/color/colorbg23.gif


#korang boleh guna background yang ina bagi 



3 comments:

Copyright Reserved by Roslina