Styling lists

In one of the earlier tutorials we looked at how to create lists in a HTML web page. In this tutorial we will look at how to style both ordered and …

CSS nth-child selector

In a couple of the previous tutorials, we looked at child selectors and pseudo classes. In this tutorial, we will move on to the nth-child selector. The nth-child selector is used to …

Styling your links

By default, links on your website will usually be blue and when the pages are linking to have been visited, the links will turn purple. However, we can customise the …

Pseudo classes

Pseudo classes are used to specify a special state of a particular element. For example, the first letter in every paragraph could be a different size, or a link changes colour …

Parent/child elements

In this tutorial we will have a look at the parent/child relationship in CSS. All elements in an HTML document can be both parents and children, except for the body …

ID Selector

In the previous tutorial, we looked at a few different types of CSS Selectors and we used the class selector to apply a style to all elements that used that …

Class Selector

Selectors are used to select elements in a  web page that you want to style. There are many types of CSS selectors including: Element selector – element selectors select all …

Divs and Spans

The div and span tags are made for CSS. A div is a section or a ‘division’ in a web page. A div can be thought of as a block. On …

How to add borders

In the previous tutorial, we looked at the box model and how to add padding around elements. In this tutorial, we will look at how to add borders around elements …

CSS Font properties

In this tutorial we will look at how to use CSS font properties in an external style sheet. We will look at how to change the font-weight (eg. normal or …