CSS

CSS (Cascading style sheets) is a much of a part of Web Design as paint is to a car. CSS is used to show how the page is displayed and as a way of cutting out the information contained within HTML tags dramatically. Below are a few examples of css and how they can be used.

<!--Add this to the head section -->
<style type="text/css">
h3 {text-align: right;
color: #FF0000;}
h4 {font-family: Georgia, "Times New Roman", Times, serif;
color:#99FF00;}
</style>

All you need to do is add the html tags to the body in this example it is <h3> and <h4>, and display some text in between to see what has happened to these tags. Here is an example of what it will look like

Hello World

How are you?

You can also make your own styles by using class and ids, the difference between the two is that in general, classes can be used more than once and ids are supposed to be used just once. To simplify this example we will recreate the example above but this time we will add a class and an id. Copy the example below.

<!-- Remember this goes into the head section -->
<style type="text/css">
.redtext{text-align: right;
color: #FF0000;}
#greentext{font-family: Georgia, "Times New Roman", Times, serif;
color:#99FF00;}
</style>
<!-- This part will go in the body section -->
<p class="redtext">I Like Red</p>
<p id="greentext">I Like Green</p>
< p class="redtext">I also like red</p>

Not much will change in the two examples apart from we used the paragraph tag to attach the class and ids, to define a class we must put a full stop '.' in front of it then give this class a name, and to define an id we use the hash symbol #.

You can also set styles to paragraphs and through css make them appear differently in the following demonstration you can see this.

This is the first example of a formatted paragraph tag as you can see this is different from the above content.

This is another example of a formatted paragraph tag.

And finally this is the last example of a paragraph tag.

And that ends this brief overview of what is capable in css I hope that you have enjoyed following this brief insight into web design and I hope that it urges you to go in search of creating some great web sites thanks for reading.
Back to top