Teaching HTML and CSS [#6]

In the last post, I gave information on adding content to your page. HTML is what one uses for content, in order to stylize your content, you must use CSS (cascading styles or cascading style sheets). It is CSS that makes your page look the way you want it to. 

Inside your <head></head> area;

<style type="text/css">

  body {
    color: purple;
    background-color: #cc0000; 
    }
</style>

The above copy shows that I want the text to be purple and the background of the body of the page to be hexadecimal value red. It is important to separate css from html. Many programs (Dreamweaver, GoLive, etc.) put ‘inline style’ in the html which makes it a tedious task editing later. Once you set up your styles either in your header section or in a linked style sheet, you can edit it once and your styles for everything that is defined will be updated. 

The above example shows your style in your header, although you can create all your styles in a separate css page. This is called an external style sheet. First a page needs to be created with an extension of .css (name.css), and put into the appropriate section of your server. Inside the header section (same place as if you put your <style type=”text/css”></style> section);

<link href="name.css" rel="stylesheet" type="text/css">

Placing that code above in each of your pages will control the styles across the entire site once more material is added and you use the same tags throughout. This makes editing super easy and keeps things very organized.

Click here for Teaching HTML and CSS [#7].