Main >> Design Resources

The Best CSS Resource Sheet Online

August 2nd, 2016 |

css resource sheet

If you’re new to web development it may feel like the more experienced developers know everything about CSS, but the truth is that everyone needs a great cheat sheet and some online resources. Here we’ve compiled a resource sheet with information about what CSS is, how it’s used, why it’s important to web developers, and a practical CSS cheat sheet you can refer to as you work.

CSS basics

CSS stands for Cascading Style Sheets. CSS and HTML work together to create what you see online, because HTML documents need something to define and format them. CSS is a style language that does that, covering advanced positions, background images, colors, fonts, height, lines, margins, width, and much more. When it comes to adding layout to websites, CSS is more sophisticated, accurate, and versatile than HTML by itself.

How CSS works

CSS lets you apply whatever style attributes you want to a website, whether you’ve defined them in a stylesheet or locally, by overriding the default tag interpretation settings of the browser. This lets you apply your redefined HTML elements, element tags, and attributes easily.

Rules, made up of declarations that define how to apply styles and selectors, are listed in stylesheets. A selector connects the style and the HTML document. Selectors include attributes (ID names and class names) and types (redefined HTML elements).

There are two parts to each CSS declaration: a property and a value. So for example, the property of a declaration might be “font-size,” and the corresponding value might be “twelve.”

A typical rule with two declarations is written with this syntax:

selector {property 1:value 1; property 2:value 2}

P {font-size:12pt; color:black}

CSS is easy to use because small variations with extra semi-colons, linebreaks, and whitespace don’t hurt your results or confuse it. This means you can format it to make it easier for you to read or to make bigger files more manageable. You can also separate multiple elements with commas to apply the same style rules to them at the same time:

H1, H2, H3, H4 {font-size:12pt; color:black}

Why CSS is important to web developers

CSS makes your life easier because back when you could only use HTML to add format and layout to the structured text, various browser producers created new HTML tags like to meet this demand. Unfortunately, this led to the misuse of structure tags as layout tags. Confusion also spread as different layout tags were created by different browsers and were not supported by other platforms.

CSS was created to solve this problem, offering universally supported layout opportunities. CSS also meant the separation of the content and presentation style of documents, making site maintenance far simpler. CSS benefits include:

· Ability to adjust layout for different types of media such as print and screen
· Ability to use a single stylesheet to control the layout of multiple documents
· Many sophisticated techniques for modifying layout
· More precise control of layout

Cheat sheet for practical CSS

Here are some of the more important cheats for everyday CSS users:

Text cheats

font-family: font used, Arial, Helvetica
font-size: text size, 5em, 60px
color: text color
font-weight: bold or regular
font-style: text style, italic or regular


div: all DIV tabs
div, span: all DIV tabs and all SPAN tags
div span: all SPAN tabs inside DIVs
div > span: all SPANs one level deep in a DIV


border: sets border style for all borders, whether solid, dashed, colored, etc.
position: places elements on screen
float: stacks elements horizontally

See the complete cheat sheet here:


CSS is an absolutely essential tool for every web developer. It revolutionized the way websites are created, and made the process far easier. It also put an end to the annoying problem of sites that could not be universally read by any browser. Make sure you’re ready to work with CSS and have a useful cheat sheet on hand as you learn.

Like what you've read? Don't forget to follow us!



About the Author:

Social Media Coordinator, Educational Representative and Platt College VFX Alumni. Likes bunnies, video games, cooking and taking frequent trips to Disneyland.

There Are No Comments

There are no comments.

Leave a Reply

Your email address will not be published. Required fields are marked *

Time limit is exhausted. Please reload CAPTCHA.