November 1, 2011

Tutorial: Cute Blockquote


Assalamualaikum,

Yay another tutorial. This one is requested by my dearest classmate, Adawiyah. I learnt this one from somewhere I can't remember.

Edit HTML, Tick Expand Widget Template

.post blockquote {
Copy and paste this code below the blockqupte code.
text-align: center;
border-top: 3px solid #000000;
border-bottom: 8px double #000000;
background-image:url(BACKGROUND URL);
padding: 5px;
}
.post blockquote:hover {
border-left: 3px solid #000000;
border-right: 3px #000000;
margin: 5px;
border-top-left-radius: 105px 15px;
border-top-right-radius: 105px 15px;
border-bottom-left-radius: 5px 5px;
border-bottom-right-radius: 5px 5px;
-webkit-box-shadow: 0 0 3px 3px #BDBDBD;
-webkit-transition-duration: 1s;
Change whatever you like. I've bolded and italic-ed the codes. When you're finished, click Save Template.

6 comments:

  1. thank you so much dear. I love you so much lah! Mmmuahhh! *gegurl jap xp

    ReplyDelete
  2. No biggie! i lap you too lah! Mmmuah! *nak gegurl sampai esok pagi pun boleh! x))

    ReplyDelete
  3. hahaha. gegurl kejap je. Tak boleh lama-lama. Btw, lawa blogskin baru blog kau. Comel-loteh gitu..Ahax.
    (=

    ReplyDelete
  4. hikhok. Lawa2! aku suka sgt33x!!!
    *memggedik lagi =P
    *ada ubat tak?

    ReplyDelete
  5. sudah-sudah la tu weh! pergi belajar, hari ni kan KHB. manyak susah wooo! x))

    ReplyDelete

~ Mind your words. I ain't dealing with rude people. ~