Home Importante! História Tutorial HTML Glossário Faqs Buscadores Sinapse
Fóruns ASCII Cores JavaScript CSS Links Novidades Browsers Conclusão
  T u t o r i a l   D H T M L / C S S   E d a u r e l i o
            2 0 0 -  2 0 0 4
Cascading Style Sheets

Cascading Style Sheets ou Folhas de Estilo em Castata, é o nome de uma tecnologia criada para complementar a linguagem HTML e facilitar a criação e manutenção de sites na Web. Sua primeira versão ou CSS1 foi lançada em Dezembro de 1996 e é um modelo simples de formatação, na maior parte para apresentações screen-based. O CSS1 tem aproximadamente 60 propriedades.

A versão CSS2, lançada em Maio de 1998, foi desenvolvida sobre o CSS1 e, além de incluir todas as propriedades do CSS1, possui por volta de 70 propriedades novas. Ambos os padrões CSS1 & CSS2 são reconhecidos pelo W3C (World Wide Web Consortium ), entidade que cuida do desenvolvimento e padronização das tecnologias ligadas à Web.

O objetivo dessa seção é apresentar uma lista das principais propriedades da Folha de Estilo e facilitar a sua localização nesta HP. Isso porque os assuntos relacionados e seus respectivos exemplos encontram-se distribuidos em diversos arquivos, então julguei mais simples criar um índice em ordem alfabética com links direcionados do que separar os assuntos. Espero que isso facilite sua pesquisa e o ajude a encontrar o que procura.

A B C D E F G H I J K L M N O P Q R S T U V W X Y Z

background  Define a cor de fundo da página

background-attachment  Determina de a imagem será fixa ou não.
  fixed  Fixa a imagem de fundo.

background-image  Define uma imagem de fundo na página, parágrafo ou texto.
  url  Indica o diretório e o nome do arquivo.

background-repeat  Define a disposição que a imagem deverá ocupar no fundo.
  no-repeat  É posicionada no canto superior esquerdo.
  repeat-x  A imagem irá se repetir na horizontal.
  repeat-y  A imagem irá se repetir na vertical.

background-position  Determina uma posição onde a imagem de fundo deve aparecer.
  bottom  Alinha a imagem de background na base.
  center  Centraliza a imagem de background.
  left  Alinha de background à imagem a esquerda.
  right  Alinha de background à imagem a direita.
  top  Alinha a imagem de background no topo.
  centimeters (cm)  Centímetros.
  inches (in)  Polegadas.
  percentage (%)  Porcentagem.
  pointd (pt)  Pontos.
  pixels (px)  Pixels.

border  Define uma borda que irá envolver o objeto.

border-bottom  Borda base.
border-bottom-color    Cor da borda base.
border-bottom-style    Estilo da borda base.
border-bottom-width    Largura da borda base.

border-color  Define a cor da borda.

border-collapse  Efeito Collapse.
  collapse  Borda em alto relevo refinada.

border-left  Borda esquerda.
border-left-color    Cor da borda esquerda.
border-left-style    Estilo da borda esquerda.
border-left-width    Largura da borda esquerda.

border-right  Borda direita.
border-right-color    Cor da borda direita.
border-right-style    Estilo da borda direita.
border-right-width    Largura da borda direita.

border-style  Define o estilo da borda.
  solid  Sólida.
  dashed  Tracejada.
  dotted  Pontilhada.
  double  Dupla.
  groove  Entalhada.
  ridge  Eriçada.
  inset  Baixo relevo.
  outset  Alto relevo.
  none  Sem borda.

border-top  Borda topo.
border-top-color    Cor da borda topo.
border-top-style    Estilo da borda topo.
border-top-width    Largura da borda topo.

border-width  Especifica a espessura da borda.
  thin  Fina.
  medium  Média.
  thick  Grossa.
  px  Determina a espessura em pixels.

color  Especifica a cor do texto.

cursor  Altera o formato do cursor.
  help  Interrogação.
  crosshair  Cruz.
  default  Cursor padrão.
  hand  Mão padrão.
  move  Cruz com setas.
  n-resite  Seta para o norte.
  ne-resize  Seta para o nordeste.
  e-resize  Seta para o leste.
  se-resize  Seta para o sudeste.
  s-resize  Seta para o sul.
  sw-resize  Seta para o sudoeste.
  w-resize  Seta para o oeste.
  nw-resize  Seta para o noroeste.
  text  Inserção.
  wait  Ampulheta.

direction  Define um sentido de leitura jogando o texto à margem direita ou esquerda.
  ltr  Da esquerda para a direita.
  rtl  Da direita para a esquerda.

filter   Cria efeito visuais em objetos.
  alpha  Efeito de opacidade.
  blur  Efeito 3D.
  chroma  Filtra uma cor pré-definida do objeto.
  dropshadow  Efeito de sombreamento disfocado.
  fliph  Inverte a imagem do objeto horizontalmente.
  flipv  Inverte a imagem do objeto verticalmente.
  glow  Efeito de borramento.
  gray  Apresenta o objeto em tons de cinza.
  invert  Inverte as cores do objeto.
  mask  Efeito transparente negativa.
  motion-blur  Cria um efeito de velocidade ao objeto.
  shadow  Efeito sombreado.
  wave  Efeito de ondulação.
  xray  Filtro de cores semelhante ao gray.

float  Define o objeto como flutuante.
  left  Objeto à esquerda.
  right  Objeto à direita.
  none  Mostra o objeto sem alteração.

font-family  Seleciona o tipo da fonte.
  Arial  Arial.
  Bookman Old Style  Bookman Old Style.
  Courier New  Courier New.
  MS Sans Serif  MS Sans Serif.
  Times New Roman  Times New Roman.
  Verdana  Verdana.
  etc, etc...  E muitas outras...

font-size  Muda o tamanho absoluto ou relativo da fonte.
  xx-small  Muito pequeno 2.
  x-small  Muito pequeno 1.
  small  Pequeno.
  medium  Médio.
  large  Grande.
  x-large  Muito grande 1.
  xx-large  Muito grande 2.

font-style  Seleciona o estilo da fonte.
  italic  Italico.
  normal  Normal.
  oblique  Obliquo.

font-weight  Define a espessura da fonte.
  extra-bold  Extra negrito.
  bold  Negrito.
  semi-bold  Semi negrito.
  medium  Médio.
  semi-light  Semi leve.
  light  Leve.
  extra-light  Extra leve.

font-variant  Variação de tamanho das fontes caixa alta.
  normal  Normal.
  small-caps  Caixa alta pequena.

height  Define a altura do objeto.
  points (pt)  Pontos.
  inches (in)  Polegadas.
  centimeters(cm) Centímetros.
  pixels (px)  Pixels.

letter-spacing  Define um espaço entre as letras.
  points (pt)  Pontos.
  inches (in)  Polegadas.
  centimeters(cm) Centímetros.
  pixels (px)  Pixels.

line-height  Define a espessura da linha.
  points (pt)  Pontos.
  inches (in)  Polegadas.
  centimeters(cm) Centímetros.
  pixels (px)  Pixels.
  percentage (%)  Porcentagem.

margin  Define uma margem equidistante entre o objeto e seus quatro lados.
margin-bottom  Define uma margem da base.
margin-left  Define uma margem esquerda.
margin-right  Define uma margem direita.
margin-top  Define uma margem de topo.
  points (pt)  Pontos.
  inches (in)  Polegadas.
  centimeters(cm) Centímetros.
  pixels (px)  Pixels.

padding  Cria um espaçamento entre o objeto e as suas quatro bordas.
padding-bottom  Espaço entre o objeto e a borda da base.
padding-left  Espaço entre o objeto e a borda esquerda.
padding-right  Espaço entre o objeto e a borda direita.
padding-top  Espaço entre o objeto e a borda do topo.
  points (pt)  Pontos.
  inches (in)  Polegadas.
  centimeters(cm) Centímetros.
  pixels (px)  Pixels.

position  Posicionamento de objetos.
  absolute  Posicionamento absoluto.
  relative  Posicionamento relativo.
  Static  Posicionamento Estático.

text-align  Especifica o alinhamento do texto.
  left  Pelo lado esquesdo.
  center  Pelo centro.
  right  Pelo lado direito.
  justify  Justificado.

text-decoration  Altera o atributo do texto.
  none  Nenhum.
  underline  Sublinhado.
  overline  Sobrelinha.
  line-through  Riscado.
  italic  Itálico.

text-indent  Cria um parágrafo no início do texto.
  points (pt)  Pontos.
  inches (in)  Polegadas.
  centimeters(cm) Centímetros.
  pixels (px)  Pixels.

text-transform  Transformação do texto.
  capitalize  Converte a primeira letra de cada palavra em maiúscula.
  lowercase  Converte todo o texto em letras minúsculas.
  upppercase  Converte todo o texto em letras maiúsculas.

vertical-align  Alinhamento vertical de objetos.
  baseline  Alinhamento pela base.
  bottom   
  middle  Alinhamento pelo meio.
  percentage  Especifica uma porcentagem vertical no alinhamento.
  sub  Cria um texto sub-escrito.
  super  Cria um texto sobre-escrito.
  text-bottom   
  text-top   
  top  Alinhamento pelo topo.

white-space  Gerencia como o browser deve tratar os espaços em branco.
  normal  Espaços normais, condição default.
  pre  Manterá todos os espaços inseridos.
  nowrap  Elimina a quebra de linha.

writing-mode  Gerencia o modo da escrita.
  lr-tb  Escrita da esquerda para a direita, do topo para baixo.
  tb-rl  Escrita do topo para baixo, da direita para a esquerda.

width  Define a largura do objeto.
  points (pt)  Pontos.
  inches (in)  Polegadas.
  centimeters(cm) Centímetros.
  pixels (px)  Pixels.

word-spacing  Altera o espaço entre as palavras.
  points (pt)  Pontos.
  inches (in)  Polegadas.
  centimeters(cm) Centímetros.
  pixels (px)  Pixels.

z-index  Define uma hierarquia na sobreposição dos objetos.

 

Home Importante! História Tutorial HTML Glossário Faqs Buscadores Sinapse
Fóruns ASCII Cores JavaScript CSS Links Novidades Browsers Conclusão
© Free Copyright - edaurelio@hotmail.com - Arquivo atualizado em 04/11/04