# Cascading Style Sheets
> [!NOTE] Cascading Style Sheets
> Cascading Style Sheets (CSS) é uma linguagem de folha de estilo utilizada para descrever a apresentação de um documento escrito em [[Linguagem de Marcação de Hipertexto|HTML]] ou XML. Ela controla a aparência visual de um site, definindo cores, fontes, layouts, espaçamentos e outros aspectos de design. O "Cascading" (em cascata) refere-se à forma como as regras de estilo são aplicadas e priorizadas quando múltiplas regras se aplicam ao mesmo elemento.
**:: Referência ::** [CSS - Wikipedia](https://en.wikipedia.org/wiki/CSS)
**:: Referência ::** [Cascading Style Sheets](https://www.w3.org/Style/CSS/Overview.en.html)
# Notas
Cascading Style Sheets, é usado para personalizar a aparência de um site. CSS pode ser adicionado das seguintes formas:
- diretamente a um elemento usando `style ="CSS: value;"`,
- Descrito entre elementos `<style>` no cabeçalho do arquivo [[Linguagem de Marcação de Hipertexto|HTML]]
- Em um arquivo separado usando o elemento [[Linguagem de Marcação de Hipertexto|HTML]] `<link>` no cabeçalho do arquivo [[Linguagem de Marcação de Hipertexto|HTML]].
É importante destacar que, uma vez que o CSS é aplicado a um elemento pai, todos os filhos recebem o estilo aplicado, a menos que seja expressamente dito no elemento filho.
Um exemplo de CSS é apresentado abaixo, sendo a cor do texto azul e o alinhamento do texto centralizado.
```html
<!Doctype html>
<html lang = "en">
<Head>
<title> Hello! </title>
</head>
<Body>
<H1 style = "color: Blue; text-align: center;"> the colorful heading! </h1>
Hello, World!
</ body>
<html>
```
Existem muitas propriedades CSS, basta pesquisar na internet. Algumas das mais comuns, no entanto, são:
- `Color`: Altera a cor do texto.
- `text-align`: indica onde os elementos devem ser apresentados.
- `Background-Color`: Altera a cor do fundo do elemento.
- `width`: largura em pixels ou porcentagem da página.
- `height`: altura em pixels ou porcentagem da página.
- `Padding`: Quanto espaço deve existir dentro do elemento.
- `margin`: Quanto espaço deve existir fora do elemento.
- `font-family`: tipo de fonte a ser usada.
- `font-size`: altura da fonte em pixels.
- `border`: tipo, cor e dimensão das bordas do elemento.
Você também pode usar [[Syntactically Awesome Style Sheet]] para escrever arquivos CSS de forma mais rápida, eficaz e clara.