Welcome to...

...the HTML & CSS tutorial. Use the menu to your right to skip to a topic, or click here to start the tutorial.

What is HTML?

HTML stands for Hyper Text Markup Language. It is the standard language defined by the World Wide Web Consortium (W3C) used to create web pages around the globe. There are currently two standards in wide use, HTML 4.01 and XHTML 1.0. See here for more info.

And CSS is...?

CSS is an acronym for Cascading Style Sheets. Essentially, they can help along with HTML code to define how your site looks in every way imaginable. From font size to placing images and creating menus, there is a way to do it with CSS. Typically when using CSS only the content of your web pages - for example the frames, tables and text - is stored in HTML. Telling your pages how they look is CSS's job. You can define unique styles that will tell the computer exactly how to make the text look and where to place it.

Why you should use CSS

Why take the time to learn and use CSS? Well, doesn't it annoy you that <font size=> can only go to five, and you don't want to open and close a gazillion <big> tags each and every time you want some big text? Or for example if you want to change the look of your site a little once it's done, how you have to go back and edit every single <font> tag?

CSS solves these problems. CSS can be stored into a file and cross-linked across pages, which means that you can use styles between your web pages. If you make one change in the CSS file, all your web pages change at the same time, all at once! No effort needed. Not to mention this makes it very easy to take a style you like from another site and put it directly on yours. Secondly, another huge advantage is you can change the entire look of your site - Image location, fonts, sizes, colors simply by making a new CSS file. Your content, as in the writing, never changes.

What you need to know

Before you read this tutorial, you'll need to know what a pixel is. A pixel is a single point in an image, so your computer screen and any digital pictures you view are formed typically of hundreds of thousands of these to result in a very clear image. This is why the higher the resolution on a screen, the smaller things seem - There are more pixels to display in the same space (your screen's size), so relatively speaking things did get smaller. However, you'll also have a much clearer image. Pixel can be abbreviated by the keyword "px". It's used a lot on CSS, so knowing how to use and measure pixels well can help you design your web page faster. One pixel alone is a tiny size. Here's a series lines with one, ten and fifty pixel heights respectively for a reference:

^ 1px

^ 10px

^ 50px

The width of the text on this page before text moves to the next line is exactly 750 pixels.