Pages

Sep 26, 2012

Tutorial: BLOCKQUOTE MACAM CCI


salam semua.. ^_^

ok kat sini cci ade 1 tutorial yang diminta oleh cik pipi merah

iaitu Blockquote mcm CCI 

Sebelum letak corsor

Selepas letak cursor

Memula seperti biasa

Buka blog korang pilih:-

Template  ›  Edit HTML

 

/* Posts

cari 

.post blockquote {     

 (ataupun)     

blockquote{
Da jumpa korang copy semua  kod yang ada di bawah.
Pastekan di bawah kod yg korang cari tadi.

 sebelum tu kene buang apa yang ada dibawah kod tu dulu ek, gantikan dengan kod yang cci bagi tu:-

border:1px solid #F6CECE;
background:url(background yang korang nak);
color:  #F6CECE; (warna font dlm blockqoute)
-webkit-transition: 0.8s;
-moz-transition: 0.8s;
box-shadow: inset 20px 0 0px 0  #FFFF99;
padding: 10px 10px 10px 26px;
font-size:14px;
font-weight:bold;
line-height: 1.5em;(ketinggian font korang)
border-radius:0px 20px 20px 20px;
-moz-border-radius-bottomleft: 20px;
border-bottom-left-radius:20px;
-moz-border-radius-bottomright: 20px;
border-bottom-right-radius: 0px;
}
blockquote:hover{
-webkit-transition: 0.8s;
-moz-transition: 0.8s;
border:2px solid #99FF33;
color:#fff; (warna font hover)
background:#FF9999;
box-shadow: inset 280px 0 0px 0 #FF99CC;

dan paste sampai atas

}
.post blockquote p {

lepas tu korang preview jadi ke tak... :) kalo jadi syukrann...


Entry yang lepas:-
http://ccicutedollylicious.blogspot.com/2012/09/bestnya-dapat-kereta-vwbeetle.html

19 comments:

  1. wow. boleh try nieh ! hihi :)

    ReplyDelete
  2. aoohh blockquote kata kuncinya.. ngahaa ^e^ patut la magik2 je dalam tu. wehee. tq 4 sharing.

    ReplyDelete
  3. tak jadi laa.. takpe mungkin takde rezeki.. hehehe bajet padahal template tak menepati piawaian.. kan.. :)

    ReplyDelete
  4. Assalamualaikum kak cci ;)

    Thanks for sharing . Sharing is caring . hehe XD . maaflah lambat reply comment sebab sekarang exam nak dekat , jarang on , lepas exam baru on balik . hehe .

    ReplyDelete
  5. awesome gitu cci.. pastu terleka dok main cursor tu je. hehe

    ReplyDelete
  6. wahhh bagus jgua ad benda ni..
    mana nk cari eh kotak2 yg comel mcm ni..
    lps tu, waktu kita tulis entry tu mcm mana nk buat jdi dalam kotak tu?

    ReplyDelete
  7. waaa...syukran cikgu...hehehe...

    saya dok cari x jumpa sbb pakai templete picture window..sebelum ni pakai yg simple senang jer cari kod dia...nnt line dah ok sket nak ikut tutorial ni..

    tensennn line siput...huhuu

    ReplyDelete
  8. wahh .. boleh bertukar.. cantik. thnx sharing ^^

    ReplyDelete
  9. cantik la.... kalau mood rajin mai blh try

    ReplyDelete
  10. cantiknya warna..nak try gak la..

    ReplyDelete
  11. tq share yek bagus ni

    ReplyDelete
  12. ia bertukar wajah ~~~ hehe..tq cci share ni

    ReplyDelete
  13. wahhh special nya kak..nk cuba hehehe :)

    ReplyDelete

terima kasih kerana singgah baca komen-komen cci
sila jangan jemu ek.. ^_^