Browse > Home / / Beatiful Blockquote


Beatiful Blockquote

3 comments
Sunday, May 24, 2009 Posted by One-4-All

blockquoteBlockquote is some section in web that it was often used to defined some important part. blockqute will indent the right and left margins both on the display. Some blogger used it to separated some code from another word of posting. We can make that blockquote look better and more interesting for anyone who look it.
We can add line to our blockquote style.

blockquoteAdd this code to make your blockquote style like that style.
blockquote{
background-color: transparent;
border-top: 3px double #DC143C;
border-bottom: 3px double #DC143C;
padding: 5px;
font-style: oblique;
font-size: 1em;
margin-left: 5%;
margin-right: 5%;
}
You can change line-color by change color code (red font). To know about color code, i suggest you read this article........ "Color Schemer Software".

Or we can add picture on our blockquote style. Like this one style.

blockquoteTo become like that you must add this code:
blockquote {
background: transparent url(your upload picture URL) repeat-x $startSide top;
padding: 5px;
font-style: oblique;
font-size: 1em;
margin-left: 5%;
margin-right: 5%;
}

First you must upload this picture and copy and paste the url to the code.
<-- This is the image you will need. Right click it then save to your desktop. Upload it to your webhost.
That picture just suggest. You can change with a picture that you like........so it can be another style.



Just add the code in your template (before line </b:skin>), and now you have a new style of blockquote.

I hope this article useful for us.
Enjoy it.

One-4-All

3 comments:

EK4zone on May 26, 2009 at 6:58 AM said...

wow, keren keren.
have a nice day with smile...:D

ayomaos on June 18, 2009 at 7:08 PM said...

a good tutorial, I will try later on my blog. Thank have shared

pandewa on June 23, 2009 at 10:41 AM said...

nice artikel

Post a Comment