HTML + CSS: Conceitos básicos - Parte 2 - ♫ Resumos de diferentes assuntos que estudo no dia a dia!

Dando seguimento ao post anterior (Detalhes) neste post irei apresentar algumas propriedades básicas muito utilizadas na formatação de documentos.

Todas as propriedades da CSS inicialmente são especificadas e depois atribuídas no documento.

Alguem: Não entendi!

Assim, inicialmente você deve especificar no seu CSS as propriedades da sua "classe" e depois atribuir a classe ao documento.

Exemplo:

Na imagem acima foi definido a "classe" p com suas propriedades definidas, então sempre onde tive a tag <p> o fundo do documento do trecho no documento vai ter a cor especificada. Indo pro HTML ficará assim:

Pode-se utilizar qualquer nome da "classe"(ex: NomeQualquer) bastando apenas no documento HTML colocar entre em tag (ex: <NomeQualquer>conteudo</NomeQualquer>).

Cores e Fundos

Refere-se a parte de aplicar cores de primeiro plano e cores de fundo no seu website.

OBS: para entender os atributos das propriedades clique nelas abaixo.

color :altera a cor da fonte. Ver códigos das cores: aqui
background-color: altera a cor de fundo da página.
background-image: acrescenta imagem no fundo do documento.
background-repeat: utilizado para determinar se uma imagem de fundo deve repetir(maneira) ou não deve repetir

background-attachment: define se a imagem de fundo deve ser fixa ou de rolagem com o conteúdo.

background-position: é usado para posicionar a imagem de fundo.

background: define um plano de fundo para o documento.

Exemplo de alguns atributos definidos:

FONTES

Trata das fontes e como aplica-las no usando CSS.

OBS: para enteder os atributos das propriedades clique nelas abaixo.

font-family: permite que você defina uma lista priorizada de nomes de família de fontes. Se a primeira opção de fonte não estiver instalada na maquina do usuário sera utilizado a segunda e assim por diante.
font-style:usado para definir o estilo da fonte para itálico, oblíquo ou normal (nomal, italic, oblique).
font-weight: especifica o peso(intensidade) da fonte, alguns navegadores suporta numeros de 100-900 em intervalos de 100
font-size : Usado para especificar o tamanho da sua fonte.

Exemplo:

exemplos de fontes

Textos

Utilizando o CSS para adicionar layouts aos textos.

OBS: para enteder os atributos das propriedades clique nelas abaixo.

text-indent : utilizado para definir o recuo da primeira linha do texto;
text-align : utilizado para alinhar elementos;
text-decoration: usado para adicionar ou remover decoração de textos. Por exemplo, você pode remover sublinha em hiperlinks, sublinhar o texto normal, adicionar uma linha acima ou no meio do texto, ou fazer um piscar de texto.
letter-spacing: ~determina o espaçamento entre as letras.
text-transform: com essa propriedade, pode-se forçar o texto a ser maiusculo ou minúsculo por exemplo.