CSS é a linguagem que cuida da aparência de uma página web.

• - Não é uma linguagem de programação.
• - É aplicado ao HTML.
• - Usa regras e propriedades para customizar elementos.

O CSS interno ou incorporado requer que você adicione a tag 'style' na seção 'head' do seu documento HTML. Este estilo de CSS é um método efetivo de estilizar uma única página. Contudo, usar esse estilo em múltiplas páginas pode consumir muito tempo, já que você precisa definir as regras CSS para cada página do seu site.

Com o CSS externo, você vai linkar as páginas da internet com um arquivo .css externo, que você pode criar usando qualquer editor de texto no seu dispositivo. Este tipo de CSS é um método mais eficiente, especialmente se você está estilizando um site grande. Ao editar um arquivo .css, você pode modificar um site inteiro de uma só vez.

O CSS inline é usado para dar estilo a um elemento HTML específico. Para este estilo de CSS você somente vai precisar adicionar o atributo style para cada tag HTML, sem usar os seletores. Este tipo de CSS não é realmente recomendado, já que cada tag HTML precisa ser estilizada de maneira individual. Gerenciar o seu site pode se tornar uma tarefa bem difícil se você só usa o CSS inline. Contudo, o CSS inline no HTML pode ser útil para algumas situações. Por exemplo, em casos onde você não tem acesso aos arquivos CSS ou precisa aplicar estilos para um elemento único.

O motor de renderização do navegador representa cada elemento como uma caixa retangular, de acordo com o padrão definido pelo CSS conhecido como box (caixa) model. Dessa forma, o conteúdo do elemento é uma das quatro partes que compõem o box, sendo as demais o seu preenchimento, borda e margem. A Figura 1 nos dá uma visão desse desenho. Na maioria dos casos, o que vemos é apenas o conteúdo do elemento, geralmente um texto, imagem, vídeo, etc. Esse conteúdo é o que consideramos as suas dimensões, altura e largura. Entretanto, é o conteúdo somado a margem, borda e preenchimento do elemento que determinam o espaço que o mesmo ocupa na tela do navegador. Por essa razão entender o box model é fundamental para a criação de layouts consistentes.

Color

A propriedade color altera a cor de primeiro plano de um texto, também chamada em algumas literaturas de foreground. Ao utilizar essa propriedade, todo o texto do elemento será alterado, assim como decorações que ele contenha.

Font

Aplicamos uma fonte ao texto de um elemento com a propriedade font-family. Essa propriedade permite informar uma lista composta por uma ou mais fontes que, quando forem encontradas pelo navegador no computador do usuário do site, serão utilizadas.

Transformações

Com o CSS também podemos aplicar transformações ao texto utilizando para isso a propriedade text-transform.
none: remove todas as transformações, o que é útil para anular algum estilo anteriormente aplicado pelo navegador; capitalize: a primeira letra de cada palavra em maiúscula; uppercase: deixa todas as letras em maiúscula; lowercase: deixa todas as letras em minúscula.

Decorações

Outra propriedade muito utilizada para decorações é a text-decoration.
none: remove qualquer transformação aplicada anteriormente; underline: aplica uma linha abaixo do texto; overline: aplica uma linha sobre o texto; line-through: risca o texto.

Sombras

Nos dias atuais é muito comum aplicarmos efeitos de sombra ao texto. Quando utilizadas corretamente, as sombras facilitam a leitura e destacam o texto de imagens ou qualquer outro elemento que seja utilizado como fundo. A propriedade utilizada para esse fim é a text-shadow, que recebe quatro valores: O primeiro valor corresponde a distância horizontal da sombra em relação ao texto no parágrafo e o segundo valor determina o deslocamento vertical. O terceiro valor indica o quanto desejamos que a sombra seja borrada, perdendo assim a sua solidez. Por último, definimos a cor da sombra

Alinhamento

A propriedade text-align permite controlar como o texto será alinhado dentro do elemento que o contém.

Altura de linha e espaçamento

Podemos controlar a altura da linha de um texto com a propriedade line-height. Geralmente utilizamos a unidade em como valor para essa propriedade para que a distância entre as linhas do texto acompanhe o tamanho da fonte.