The Basics of CSS

syntax summary

Okay, let's talk about styling our site...well, unless you love your site looking like it's from 1991, then go on and rock that. Now, for the rest of us who want to add an extra level of depth to our websites.

CSS, which stands for cascading style sheets, is a specific language that you use in connection with HTML documents to provide style to your web project. Even more specific, CSS has the power over HTML elements to tell them how they will not only look but also how they will behave. This power is conveyed through lines of code called rules. A CSS rule looks something like this...

This rule here has the power of changing all of the h2 elements on the linked HTML documents to present themselves as the color purple.

Let's break down this rule into its two parts. A CSS rule has two parts, the selector(s) and the declaration.

The selector(s) has the responsibility of saying which element(s) the rules will apply to. 

The declaration describes how the selector elements will be styled. It should be noted that CSS declarations themselves have two parts.

A CSS property tells us the aspects of the element in which you want to be changed.

A CSS value specifies the settings you need for the preferred properties.

One last note, while CSS can be used to change the color and sizes of fonts, set margin sizes, and perform many other styling techniques. CSS, through the advent of the latest incarnation of CSS, has taken on a lot of the attributes of JavaScript, in that CSS3 can manipulate how your website performs certain tasks.

Properties like animations and transitions can add a whole new level of depth and functionality to your page that has never been seen before.

Next up, I will cover the three ways to implement CSS to your website; inline, internal, and external styling.