Codex

< Fontes | Índice | Links >

CSS é usado para estilizar elementos HTML.


Veja! Estilos e Cores

Este texto está em Verdana e vermelho

Este texto está em Times e verde

Este texto tem 30 pixels de altura


Estilos no HTML com CSS

CSS foi produzido juntamente com HTML 4, para fazer um jeito melhor de estilizar elementos HTML.

CSS pode ser usado com HTML das seguintes maneiras:

  • em arquivos Cascading Style Sheet (arquivos CSS)
  • dentro do elemento <style> na seção head do documento HTML
  • dentro do atributo style em um elemento HTML

Usando o atributo style em HTML

Não é muito prático e consome tempo usar o atributo style em cada um dos elementos que se quer aplicar estilo.

A melhor maneira de usar CSS com HTML, é colocar a sintaxe do CSS em outro arquivo, um arquivo CSS.

No entanto, neste tutorial vamos ensiná-lo como usar o atributo style primeiramente. Faremos isso para simplificar os exemplos e para entender seus efeitos.

Você pode aprender tudo o que existe para aprender sobre CSS em nosso tutorial.


Exemplo de estilos em HTML - Background Color

A propriedade de CSS "background-color", define a cor de fundo de um elemento HTML:

Exemplo:

O resultado seria como olhar uma página e ver no quadrado abaixo o seguinte:

Este é um título

Este é um parágrafo

A propriedade background-color torna obsoleto o antigo atributo bgcolor do HTML.


Exemplo de estilos em HTML - Fonte, Cor e Tamanho (Font,Color,Size)

As propriedades font-family, color e font-size definem respectivamente a fonte, cor e tamanho do texto em um elemento:

Exemplo:

As propriedades do css, font-family, color e font-size, fazem obsoleta a tag <font> do HTML.


Exemplo de estilo no HTML - Alinhamento de Texto

A propriedade text-align especifica o alinhamento horizontal do texto em um elemento HTML:

Exemplo:

A propriedade text-align do CSS, torna obsoleta a tag <center> do HTML.


Tags e atributos obsoletos

No HTML 4, algumas tags e atributos estão obsoletos. Obsoleto significa que não terão suporte em browsers e na especificação no futuro.

A mensagem é clara: Não use tags e atributos obsoletos!

Esta lista de tags e atributos deve ser evitada:

Tags Descrição
<center> Obsoleto. Centraliza conteúdo
<font> e <basefont> Obsoleto. Define fontes em HTML
<s> e <strike> Obsoleto. Define texto riscado
<u> Obsoleto. Define texto sublinhado
Atributos Descrição
align Obsoleto. Define o alinhamento do texto
bgcolor Obsoleto. Defines a cor de fundo
color Obsoleto. Define a cor do texto

Ao invés de usar os itens acima, use estilos e propriedades em CSS.

< Fontes | Índice | Links >