Check out my brand new PSD site XD Content Domain About me, Mel. Home :]

Home > Content > Tutorials

Blockquotes

This nifty retangle is a blockquote. You can segregate specific text, images, quotes, HTML from your boby and, with the help of CSS, change colours, fonts, borders and so on.
THE TAGS
<blockquote> anything typed here will be
included in your blockquote </blockquote>

Not much is happening so far, infact if you use the above code in a webpage its going to appear as regular text. Thats why we need CSS to liven things up and add some style! By adding the below CSS to your Stylesheet, changing the properties to your liking, you'll have a neat little blockquote in no time :)
blockquote {
font-weight: normal;
text-transform: none;
text-align: left;
font-family: Trebuchet MS;
font-size: 11px;
line-height: 15px;
color: #737373;
letter-spacing: 1px;
background-color: #595959;
border-left: 5px solid #6DCFF6;
background-image: url();
background-position: top left;
background-repeat: no-repeat;
margin: 30px;
padding: 10px;
text-indent: 20px;
}