«<Back

Next»>

Useful Properties

Below is a list of useful properties that can be modified with CSS, compiled by Digital Fellow Patrick Smyth. There are also CSS cheatsheets available online.

Color

Determines text color. Can be a word or a hex value, like #FFFFFF:

color: blue;
color: #000000;

Background color

Sets the background color of an element.

background-color: pink
background-color: #F601F6;

Text align

Aligns text to the left, center, or right.

text-align: center;

Padding

The space between text and the “box” (<div>) surrounding it.

padding: 10px;
padding-right: 10px

Margin

The space between an element’s box and the next element (or the edge of the page).

margin: 10px;
margin-top: 10px;

Width and height

Sets the width or height of an element. Typically, don’t set both of these.

width: 50%;
height: 40px;

Float

Determines if text wraps around an element.

float: left;

Display

Determines if an element is treated as a block or inline element. Can also be set to none, which makes the element disappear.

display: inline;
display: block;
display: none;

List style

Determines default styling on lists. Usually best to set it to none.

list-style-type: none;

Font family

Sets the font. Usually best to copy this from Google Fonts or another web font repository.

font-family: 'Lato', sans-serif;

«<Back

Next»>