CSS Cheat Sheet – A Complete Guide for Beginners and Professionals
access_time
hourglass_empty
person_outline

CSS Cheat Sheet – A Complete Guide for Beginners and Professionals

In this article, we’re going to share a CSS Cheat Sheet that will be useful for all of your web development projects. What is more, you’ll find 13 pages of CSS and CSS3 declarations alongside several possible properties. Let’s get started!

Upgrade your web hosting and try Hostinger today!

Get Started Here


Getting to Know CSS

Cascading Style Sheet or CSS is a stylesheet language that dictates how your website elements should look like. You can control the design, layout, font, and the color of your website content by embedding a CSS file into your HTML document.

Let’s take a look at how CSS works, by breaking down the syntax:

selector {declaration}

The declaration can be broken down into:

selector {property: value;}

As you can see, the CSS syntax consists of a selector and a declaration block. The selector is the HTML element that you’re about to control. Whereas the declaration block contains the property name and the value of the HTML element – both of them are separated by a colon (:) and declared within curly brackets ({}).

Let’s say you want the font size of your heading one (h1) to be 20 pixels. Your syntax should look like this:

h1 {font-size: 20px;}

In this case, the selector is h1. Then, font-size is the property name, and 20px is the value.

Since CSS has so many selectors and declarations that might be hard to remember, we’ve put together a complete CSS and CSS3 Cheat Sheet to help you master the language.

Download CSS Cheat Sheet in .pdf

Download CSS Cheat Sheet in .jpg

Once you’ve downloaded the CSS Cheat Sheet, save the file to your device or print one out. This way, you’ll easily find what you’re looking for.

CSS Cheat Sheet Table of ContentsCSS 3 CheatsheetCSS 3 Cheatsheet Page 4CSS 3 Cheatsheet Page 5 CSS 3 Cheatsheet Page 6CSS 3 Cheatsheet Page 7CSS 3 Cheatsheet Page 8CSS 3 Cheatsheet Page 9CSS 3 Cheatsheet Page 10CSS 3 Cheatsheet Page 11CSS 3 Cheatsheet Page 12CSS 3 Cheatsheet Page 13

The Author

Author

Domantas G. / @domantas

Domantas leads the content and SEO teams forward with fresh ideas and out of the box approaches. Armed with extensive SEO and marketing knowledge, he aims to spread the word of Hostinger to every corner of the world. During his free time, Domantas likes to hone his web development skills and travel to exotic places.

Author

Konrad Dariusz Wołoszyn Reply

October 01 2017

Where is flexbox, my friends?

Author

Bernd Steinig Reply

September 25 2018

Absolutely cool!

Author

AlexanderMunna Reply

November 27 2018

very cool and easy to understand

Author

PRADIP KUMAR BARUA Reply

January 06 2019

Very cool and easy to understand! :)

Author

Cinthya Reply

March 04 2019

Thank you so much for the CSS and the HTML cheat sheets. I have my blog and am taking a course on web development (so that I can make changes to my site on my own). And there is so much to learn! Your cheat sheets are sure to make my studying easier. Thanks so much!

Author

Ubong James Reply

April 22 2019

wow! this's cool. I LOVE THIS. Please more updates. Thanks!

Author

Tinus Reply

September 23 2019

Awesome. Is there maybe a possibility that you have this in a printer friendly version? Thanks in advance.

    Author

    Domantas G.

    Replied on September 24 2019

    Hey Tinus, Our designer will create a black and white version for printing. Meanwhile, you can simply print PDF version.

Author

kunla Reply

October 10 2019

Realy good.

Author

Alam Reply

October 24 2019

Thank you very much

Author

abraham koliu Reply

November 22 2019

All the tutorials have been wonderful.

Author

rashid hussain Reply

March 01 2020

thank you

Author

maheshkumar sharma Reply

June 23 2020

thank you. its cool and helpful thanks.....

Author

Natalie Reply

June 29 2020

Thank you so much for creating all these cheat sheets!

Leave a reply

Comment*

Name*

Email*

This site uses Akismet to reduce spam. Learn how your comment data is processed.

Become a part of Hostinger now!