Blockquotes with Images

Blockquotes with Image Quotes

Some like to add an image to the blockquote style. For this one we added a quote image to the blockquote and the unquote to the paragraph <p> tag.

This is a blockquote with an image, the beginning quotation mark. We can make it with an end quote too by adding another image named unquote.gif. Thank you Claude for the quote mark images.

Copy and paste this CSS in your style sheet.

Copy and paste this in your Blog or Web page.

It will look like this.

This is a blockquote with an image, the beginning quotation mark. We can make it with an end quote too by adding another image named unquote.gif.

Instant Blockquote with Images

This is inline CSS. This gives instant results if you don't want to add the style to your style sheet. Let's see what happens when we make the quote long enough to make sure that the unquote.gif and the words do not overlap.

Copy and paste this CSS in your style sheet.

It will look like this.

This is inline CSS. This gives instant results if you don't want to add the style to your style sheet. Let's see what happens when we make the quote long enough to make sure that the unquote.gif and the words do not overlap.