# Cheatsheet de propriedades básicas do CSS

### cores
nomes de cores (red, white), hexadecimais (#FFFFFF, #F0F0F0), RGB (rgb(255, 0, 0), rgb(255, 255, 255)) e outros.
referência: [W3 Schools Unidades de cores](https://www.w3schools.com/cssref/css_colors_legal.asp)

### unidades de tamanho
px, em, rem, vh, e outros
referência: [W3 Schools Unidades de tamanho/posição](https://www.w3schools.com/cssref/css_units.asp)

## Texto

| Nome | Descrição | Valores |
| --------------------------------------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------- | ---------------------------------------------------------------------- |
| [`color`](https://www.w3schools.com/cssref/pr_text_color.asp) | Define a cor do texto | [**cores**](#cores) |
| [`text-align`](https://www.w3schools.com/cssref/pr_text_text-align.asp) | Define o alinhamento horizontal do texto | left, right, center, justify |
| [`text-decoration`](https://www.w3schools.com/cssref/pr_text_text-decoration.asp) | **Shorthand** para as propriedades `text-decoration-line`, `text-decoration-color`, `text-decoration-style` | `text-decoration-line` `text-decoration-color` `text-decoration-style` |
| [`text-decoration-line`](https://www.w3schools.com/cssref/css3_pr_text-decoration-line.asp) | Define qual decoração utilizar no texto | none, underline, overline, line-through |
| [`text-decoration-color`](https://www.w3schools.com/cssref/css3_pr_text-decoration-color.asp) | Define a cor da decoração do texto | [**cores**](#cores) |
| [`text-decoration-style`](https://www.w3schools.com/cssref/css3_pr_text-decoration-style.asp) | Define o estilo da decoração do texto | solid, double, dotted, dashed, wavy |

## Fontes

| Nome | Descrição | Valores |
| ------------- | ----------------------------------------- | ------------------------------------------------------------------------------------------------------ |
| [`font-family`](https://www.w3schools.com/cssref/pr_font_font-family.asp) | Define a fonte do texto | nomes de fontes (Arial, Times New Roman) e fontes genéricas (sans-serif, serif) |
| [`font-weight`](https://www.w3schools.com/cssref/pr_font_weight.asp) | Define o peso ou intensidade de uma fonte | normal, bold, bolder, lighter e números de 100 até 900 |
| [`font-size`](https://www.w3schools.com/cssref/pr_font_font-size.asp) | Define o tamanho da fonte | medium, small, large, smaller, larger, [**unidades de tamanho**](#unidades-de-tamanho), porcentagem do tamanho da fonte do pai |

## Elementos

| Nome | Descrição | Valores |
| ------------------------------------------------------------------------------------ | ------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------ |
| [`background`](https://www.w3schools.com/cssref/css3_pr_background.asp) | **Shorthand** para as propriedades `background-color`, `background-image`, `background-position`, `background-size`, `background-repeat` e outras | `background-color` `background-image` `background-position/background-size` `background-repeat` |
| [`background-color`](https://www.w3schools.com/cssref/pr_background-color.asp) | Define a cor do fundo de um elemento | transparent ou [**cores**](#cores) |
| [`background-image`](https://www.w3schools.com/cssref/pr_background-image.asp) | Define uma ou mais imagens para o fundo do elemento | url (caminho para a imagem) ou none |
| [`background-position`](https://www.w3schools.com/cssref/pr_background-position.asp) | Define a posição inicial da imagem de fundo do elemento | combinação de 2 valores (left, top, right, bottom e center), (x% e y%) ou (x e y) |
| [`background-size`](https://www.w3schools.com/cssref/css3_pr_background-size.asp) | Define o tamanho da imagem de fundo do elemento | auto, cover, contain, [**unidades de tamanho**](#unidades-de-tamanho) ou porcentagem do tamanho do pai |
| [`opacity`](https://www.w3schools.com/cssref/css3_pr_opacity.asp) | Define o nível de opacidade/transparência de um elemento | de 0 a 1 onde 0.0 é totalmente transparente e 1.0 totalmente opaco |

###### tags: `cheatsheet` `front-end` `módulo 1`