Introduction to CSS

HTML on its own, as you can probably see, looks very boring on its own and looks nothing like all of the websites you will see on the web. To make websites look nicer, you will need to use CSS. CSS is even easier to learn than CSS, as it always looks very similar. Here is what is can look like:

h1 {
    color: red;
    font-family: Arial, sans-serif;
    font-size: 44px;
}

The CSS code above makes the main heading: <h1>,  red and Arial, size 44px. This is not much of a step forward, but shows how easy it is to manipulate HTML with CSS. The screenshot below shows the HTML page I laid out in the last post, with the above CSS.

To link a CSS file to an HTML file, you need to add a link tag to the head of the html page. To link a CSS page, called 'styles.css', you will need to add this link to the top of your html page: 

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

The 'styles.css' page will need to be in the same folder as the html page.