There was a need to use blockquotes for different uses. Warning, Informational, Stop, Go, or as a blockquote. The possibilities are endless. This is possible by giving the blockquote element a class attribute within your (X)HTML or post, and define the class in the style.css file of your theme. This technique was found here.

In this example, where the following elements are defined in style.css as the following:

blockquote {
margin: 20px 0;
padding: 0 20px 0 50px;
background: url('images/quote.png') no-repeat 20px 14px #f8f8f8;
border: 2px solid;
color: #461B7E;
}

.red {
padding: 0 20px 0 20px;
color: #DF0101;
background: #f8f8f8;
text-align: justify;
}

To use only blockquote the result will be:

This is a test using only blockquote.

To use blockquote class=”red” the result will be:

This is a test adding a class to the blockquote.