💾 Archived View for gem.sdf.org › s.kaplan › cheatsheets › programming-languages › css.md captured on 2023-09-28 at 16:23:55.

View Raw

More Information

-=-=-=-=-=-=-

# CSS Cheatsheet

## Unique Features

- Cascading Style Sheets used to style HTML documents
- Allows for separation of presentation and content
- Can be applied to individual elements or entire documents
- Includes a wide range of selectors and properties for customization

## Basic Syntax

selector {

property: value;

}

## Selectors

- `element`: Selects all elements of a specific type
- `#id`: Selects an element with a specific ID
- `.class`: Selects all elements with a specific class
- `element, element`: Selects multiple elements
- `element > element`: Selects a direct child element
- `element + element`: Selects the next sibling element
- `element ~ element`: Selects all sibling elements

## Properties

- `color`: Sets the color of text
- `background-color`: Sets the background color of an element
- `font-family`: Sets the font family of text
- `font-size`: Sets the font size of text
- `font-weight`: Sets the weight (boldness) of text
- `text-align`: Sets the horizontal alignment of text
- `text-decoration`: Sets the decoration of text (underline, etc.)
- `padding`: Sets the padding of an element
- `margin`: Sets the margin of an element
- `border`: Sets the border of an element
- `width`: Sets the width of an element
- `height`: Sets the height of an element
- `display`: Sets the display style of an element
- `position`: Sets the position of an element
- `z-index`: Sets the stacking order of elements

## Units

- `px`: Pixels
- `%`: Percentages
- `em`: Relative to the font size of the element
- `rem`: Relative to the font size of the root element
- `vh`: Relative to the height of the viewport
- `vw`: Relative to the width of the viewport

## Resources

- [MDN Web Docs](https://developer.mozilla.org/en-US/docs/Web/CSS)
- [W3Schools](https://www.w3schools.com/css/)