Style Your Blog Posts Elements Separately

An HTML element is everything from the start tag to the end tag.

• An HTML element starts with a start tag / opening tag

• An HTML element ends with an end tag / closing tag

• The element content is everything between the start and the end tag

• Some HTML elements have empty content

• Empty elements are closed in the start tag

• Most HTML elements can have attributes

-W3schools

In order to separately  style each HTML elements  in your blog posts, you need to define them by using their unique selector. Let's say for example, you want to style your blog post image. Define them by using this CSS selector;

.post-body img{property:value;}

You need to include .post-body then specify html tag, like the example above. This is because your blog post body is enclosed with <div class='post-body'>...</div>

Therefore, in every element inside the posts body you need to include .post-body.In that case, other than your post body elements won't be affected. Other HTML elements you might consider styling.

• .post-body a:link
• .post-body a:visited
• .post-body a:hover
• .post-body a:active
• .post-body h1...h6
• .post-body ul , .post-body ul li
• .post-body ol , .post-body ol li

I guess the above elements are the most used ones. You need to go to Template > Edit HTML then paste your CSS codes above ]]></b:skin>
That's all folks! :D