CSS

Mini CSS cheat-sheet for editing websites

These are the most common CSS attributes I use for editing existing websites

General

Append !important if your style doesn’t get applied. This overrides other styles, e.g. display: none !important;

display: none, block, inline-block

Colors & font style

Text color

color: red, #FF0000, lightblue – goto https://colorpicker.me/ and then copy the hex code

Color of the block behind the text:

background-color: red, #FF0000, lightblue – goto https://colorpicker.me/ and then copy the hex code

Other font styling:

font-weight: normal, bold

font-size: 200%, 30px

Spacing

Space outside the element (to other elements)

margin-top / margin-left / margin-right / margin-bottom: 20px

Space inside the element, to its content:

padding-top / padding-left / padding-right / padding-bottom: 20px

Geometric properties

Make the corners of a block rounded instead of sharp:

border-radius: 5px

Width and height of the element

width: 100%, 300px, 30vw

height: 30px, 100%

 

Posted by Uli Köhler in CSS