CSS

CSS, short for Cascading Style Sheets, is a style sheet language used to style websites. Colors, fonts, and page layouts for a site can all be managed using CSS.

Topics

Selectors

* All elements.
div All div tags.
div, p All divs and paragraphs.
div p Paragraphs inside divs.
div > p All p tags, one level deep in div.
div + p Paragraph tags immediately after div.
div ~ p Paragraph tags preceded by div.
.classname All elements with class.
#idname Element with ID.
div.classname Divs with certain classname.
div#idname Div with certain ID.
#idname * All elements inside #idname.

Pseudo Classes

a:link Link in normal state.
a:active Link in clicked state.
a:hover Link with mouse over it.
a:visited Visited link.

Common Properties

align-content Behavior of the flex-wrap property.
align-items Alignment for items inside the container.
background-color Sets the background color.
background-image Sets the background as image.
border Sets all border properties in one line.
border-collapse Collapses the border.
border-style Sets the border the style.
color Text color.
font-family Font of the element.
font-size Font size of text.
height Height of the element.
margin Set the top, right, bottom and left margins in one line.
padding Padding between the element border and content.
text-align Horizontal alignment of text.
text-decoration Overline, underline or line-through the text.
visibility Visibility:hidden elements leave a gap.
width Width of an element.

Display & Positioning

display Determines the type of render block for an element. The most common values for this property are block, inline, and inline-block.
float Determines how far left or how far right an element should float within its parent element.
position:absolute Removes an element entirely from the document flow.
position:fixed Set/pinned to a specific spot on a page. The fixed element stays the same regardless of scrolling.
position:relative Enables an element to be positioned relative to where it would have originally been on a web page.
z-index Specifies how far back or how far forward an element will appear on a web page when it overlaps other elements.

Colors

rgba() hsla() Alpha values determine the transparency of colors in CSS.
#ff0000 Hexadecimal (or hex) notation. Hexadecimal digits can represent sixteen different values using 0-9 and a-f.
hsl() This syntax contains three values: hue (the color value itself), saturation (intensity), and lightness.
rgb() Should be supplied with three values representing red, green, and blue. These values range can from 0 to 255.

Typography

font-weight Declares how thick or thin should be the characters of a text.
font-style Determines the font style in which text will appear.
@font-face Allows external fonts or font files to be imported directly into stylesheets.The location of the font file must be specified in the CSS rule so that the files can be loaded from that location.
line-height Declares the vertical spacing between lines of text.