CSS

CSS is a language that specifies the style of the HTML document. Basically, how the elements of the document should look like and how they should be positioned, like paragraph styles in a text editor.

In CSS you have selectors that help you target the styles to specific parts of the HTML. These can be tag names or they could be your customly chosen id or class properties that you can give to tags.

You can combine selectors to target even more specific parts of your website, but usually it’s better to use more general selectors so you can apply styles to all elements that need the same style.

CSS styling information could be directly written to the HTML document but it is cleaner to write it somewhere else, usually in a styles.css file.

Examples of CSS properties

• font-family
• font-size
• color
• background color
• position
• display
• margin
• padding
• border
• grid

Examples of CSS selectors

• body
• p
• a:hover
• button:active
• .gameContainer
• #nameInput
• footer a

Returning to our paper plane analogy again: You have all this text and these images that you received inside your paper plane, now you cut all them out and CSS is the instructions how you should organize them on your desk and what color you should use for them etc.