How to show different background color or image for separate posts or paragraphs

To highlight a paragraph in a post, or to add a color to the complete post, like the one displayed, add these code lines to the post/paragraph.

<div style=”background:#FFE1FF; padding:5px 8px 5px 8px;”>

YOUR TEXT HERE

</div>

In place of #FFE1FF, put the hex HTML color code of any color as you like.

And to add a background image to the entire post or to any specific paragraph, use this code

<div style=”background:url(URL/Direct link OF the Image) no-repeat;”>

YOUR TEXT HERE

</div>

Blogger Help

10 thoughts on “How to show different background color or image for separate posts or paragraphs

  1. Is it possible to force your image to automatically stretch or shrink depending on the size of the post? I'm thinking you could use some code like 100% but I can't seem to get it to work.
    Any ideas?

  2. In my blog, the post area width is around 575px, so I generally use images at 550-570px and I define the width of images every time I use any image depending on the original width of the images…

  3. Thanks Divya,
    How do I define that. My issue is that the image I have is like a frame and I would like the height of it to stretch to the length of the post.

  4. In th above code, add height or width too, like this:

    <div style="background:url(URL/Direct link OF the Image) no-repeat; height: 500px; width: 450px;">
    YOUR TEXT HERE
    </div>

    You can make height/width as 100% too, but make sure that you maintain the aspect ratio, otherwise images will look horrible !

Leave a Reply

Your email address will not be published. Required fields are marked *