Testing CSS in a post

Posted by Neville on June 16, 2011 under Blogging, How To | 3 Comments to Read

Cascading Style SheetThis is a demo of using CSS in a post.

This is ordinary text.

and now

This is indented large text.

The above was made using the style attribute for a paragraph.
The values that were manipulated were:

  • font size
  • font colour
  • margin for the indent
  • font weight

CSS (or Cascading Style Sheet) allows you to play with the way that your post looks.

The  word Cascading refers to the way in which the formatting code is used in a web page like this post.

When the code is interpreted by the browser it happens something like this:

  1. If there are style commands in the Body of the code, the browser acts on those commands. These take priority over the following.
  2. Style commands in the header come into play if not over-ridden by the above. This is called an Internal Style sheet and the code is found in the Head of the page code.
  3. If a separate External Sheet is called on by the page, this determines the attributes that have been coded. These will be acted on, unless called on by earlier Style commands. (In the Head or Body of the page).
  4. Finally, if there are no Style commands in any of the above, the page will be displayed according to the default settings of the browser interpreting the code.

The above is a very  brief overview of CSS, but hopefully helps to begin you understanding of CSS.

Just from the brief example above you may be able to see the possibilities by coding some CSS into your posts. Look for future posts with hints and tips for formatting with CSS style commands.

The experts among you will also be able to do much more than this little example by playing with the code of your WordPress theme.

WARNING: BackUp before playing with the code!

If you enjoyed this post, please consider leaving a comment or subscribing to the RSS feed to have future articles delivered to your feed reader.
  • Mohann said,

    Nice intro to CSS, Nev. When we have to post content only from an HTML editor, Inline Style offers great opportunities to make the content attractive and readable. And thanks, Nev for your article in our Design Your Page Group.

  • Paula van Dun said,

    I am not very good at it. I sometime use a ccs generator ot copy/paste s style sheet i like.

  • Neville said,

    Yes Paula, it’s not particularly easy to do well, but I’ve decided to give it a go.

    I am happy with the result so far. When I’ve got my head around using the inline style processestThe next target will be to be play with the css code in the theme.

    Now that’s scarey!