CSS (Cascading Style Sheet) são folhas de estilo em cascata.

_Pra que servem? _

Servem para definir um estilo para o seu documento Web (HTML, XHTLM, por exemplo). Ao invez de você ter que toda hora definir dentro da tag usada os atributos desejados, basta fazer isso uma vez pelo CSS.

Ex.: Se você quer que toda a tag

tenha a fonte de cor azul, Verdana e tamanho 12px. Basta configurar ela no CSS dessa maneira:

1
2
3
4

p {
    font: 12px Verdana;
    color: blue;
}

E assim todas as tag

terão essa mesma característica. Caso você não queira que isso se aplique a todas mas sim em apenas algumas tag

, você pode definir uma classe com tais características e depois dentro da tag chamar essa classe.

Ex.:

1
2
3
4

.minhaclasse {
    font: 12px Verdana;
    color: blue;
}

repare que para definir uma classe é necessário começar com um ponto.

e na tag:

1

<p class="minhaclasse"> Meu parágrafo aqui </p>

Como que eu uso o CSS?

Há duas maneiras de aplicar uma folha de estilo em seu documento, uma é definir na própria página, ou chamar um arquivo externo de extensão .css. A segunda opção posibilita muito mais flexibilidade, devido a que você não irá precisar mudar os estilos página por páginas, caso venha querer mudar a “cara” do seu documento, e sim só alterar uma vez o próprio arquivo .css.

Sintaxe:

A sintaxe do CSS é muito simples. Primeiro coloca o nome da tag que queira definir o estilo abra “{” coloca os atributos e depois fecha “}”.

Os nomes das classes devem ser iniciados com um “.” e dos ID com “#”.

Ex.:

1
2
3
4
5
6
7
8
9
10
11
12

body {
    background: black;
}

_**.minhaclasse** {
    color: #FF0000;
}

#meuDiv {
    width: 100px;
    height: 200px;
}

mais aqui

A diferença primordial entre class e id, é que a mesma classe você usa mais de uma vez em tags diferentes, enquanto o id é usado uma única vez - por uma