Loading

Experience your first taste of a career in tech. Join our FREE in-person coding workshop on 15th May.

Back to all posts

Coding for Beginners: CSS

Written by Ashley Coles, 2 December 2022

Coding for Beginners: CSS 1
If HTML is the frame of a building, with CSS we're painting the walls, adding curtains, and carpeting the floor.

Core Languages of the Web

In part one of this three-part series, we looked at the first core language of the web: HTML. The language used to give our web pages their basic structure.

In this part, we will look at CSS, a language used to add styling to our HTML documents. In other words, the language we use to dress web pages up to look nice.

What is CSS?

Cascading Style Sheets, or CSS for short, is the counterpart to HTML. We already know that HTML is like the frame of a building, it defines how many floors there are and how many rooms, but it sure doesn’t look very appealing by itself. We use CSS to supplement our HTML structure, painting the walls, adding curtains, and carpeting the floor.

Who created CSS?

CSS was initially released in 1996, three years after HTML (that makes it 25 years old!). Originally proposed by Håkon Wium Lie, a colleague of Tim Berners-Lee (chief creator of HTML, in case you’ve forgotten) at CERN. While webpages were styled before CSS was created, the styling was actually a part of the web browser, meaning that all web pages a user viewed would look pretty much the same.

The idea behind CSS was to separate the web browser and the styling, allowing the creator of the website to specify how it should look.

While CSS is now fully adopted, there were some stumbling blocks along the way, largely due to Microsoft’s failure to properly support CSS in Internet Explorer 3. It wasn’t until 2000 when Internet Explorer 5 was released that CSS was finally fully supported by a web browser.

Coding for Beginners: CSS 2
CSS allows us to select specific elements in our HTML page for styling.

What is CSS used for?

The first step of writing CSS is working out which HTML element we want to style, CSS allows us to select specific elements in our HTML page for styling.

Once we have selected an element, we can apply various style rules to that element, for example, we can use CSS to change things such as:

  • Font size, font face, and colour
  • Background colours and images
  • Creating borders around content
  • Aligning content
  • Creating basic animations

Of course, this is just a very small snippet of what CSS can do!

Like HTML, all web browsers are able to understand CSS, they can interpret the CSS and apply the style rules to the HTML that the browser is displaying.

CSS today

CSS is still a core language for building web pages, its popularity is vast. Pretty much every single website you have ever visited makes use of CSS.

Its popularity has spawned a vast ecosystem of tools used to make developers’ lives easier, ranging from Bootstrap (a library of pre-styled HTML components used to rapidly build web pages) to SCSS (a new language built on top of CSS containing features that make writing CSS faster and easier).

What should I learn after CSS?

Once you’ve got to grips with CSS and HTML, the next logical step is to take a look at Javascript to add interactivity and advanced functionality to your web designs. And that’s exactly what we’ll be doing in part three of this series.

If you’re curious about coding and want to find out more, including how to build websites using HTML, CSS and Javascript, check out our Coding Quick Start short course and learn to code in just eight weeks.

 

Further Reading