[Página prévia] [Próxima página] [Seção página de conteúdo]

Propriedades e Valores de Caixa

Logo abaixo se encontram propriedades e valores para caixas. (Eu incluí aqui somente propriedades suportadas atualmente pelo Internet Explorer e pelo Netscape -- outras propriedades serão acrescentadas na medida em que elas passem a ser suportadas)

Propriedades e Valores Normalmente Usados em Cascading Style Sheets

Legenda
IE3 Suportado pelo Internet Explorer 3.x
IE4 Suportado pelo Internet Explorer 4.x
N4 Suportado pelo Netscape 4.x
pt = pontos
in = polegadas
cm = centímetros
px = pixels
em = altura da fonte do elemento
(a unidade em ainda não é amplamente suportada e deve ser usada com cuidado)
  Propriedade Descrição Valores Exemplo
Propriedades de Caixa e de Margens
IE3 IE4
N4
margin-left (não herdado) Ajusta a distância a partir do lado esquerdo da página tamanho (pt, in, cm, px)
{ margin-left: 1in }
IE3 IE4
N4
margin-right (não herdado) Ajusta a distância a partir do lado direito da página tamanho (pt, in, cm, px)
{ margin-right: 1in }
IE3 IE4
N4
margin-top (não herdado) Ajusta a distância a partir da parte de baixo do elemento prévio tamanho (pt, in, cm, px)
{ margin-top: -20pt }
IE3 IE4
N4
margin-bottom (não herdado) Ajusta a distância a partir da parte de cima do próximo elemento tamanho (pt, in, cm, px)
{ margin-bottom: 20pt }
IE3 IE4
N4
margin (não herdado) Ajustas as margens em todos os quatro lados de um elemento (Se houver somente um valor, ele se aplica a todos os lados; se houver dois ou três, o valor que falta será tomado do lado oposto.) tamanho (pt, in, cm, px) ou porcentagem do tamanho da fonte na ordem: alto, direita, baixo, esquerda
{ margin: .5cm .5cm 1cm .5cm }
IE4
N4
padding (não herdado) Ajusta o preenchimento em todos os quatro lados do conteúdo de um elemento (Se houver somente um valor, ele se aplica a todos os lados; se houver dois ou três, o valor que falta será tomado do lado oposto.) tamanho (pt, in, cm, px) ou porcentagem do tamanho da fonte na ordem: alto, direita, baixo, esquerda
{ padding: .5cm .5cm 1cm .5cm }
IE3 IE4
N4
padding-top (não herdado) Ajusta o preenchimento na parte de cima do conteúdo de um elemento tamanho (pt, in, cm, px) ou porcentagem do tamanho da fonte
{ padding-top: 5pt }
IE4
N4
padding-right (não herdado) Ajusta o preenchimento no lado direito do conteúdo de um elemento tamanho (pt, in, cm, px) ou porcentagem do tamanho da fonte
{ padding-right: 5pt }
IE4
N4
padding-bottom (não herdado) Ajusta o preenchimento na parte de baixo do conteúdo de um elemento tamanho (pt, in, cm, px) ou porcentagem do tamanho da fonte { padding-bottom: 5pt }
IE4
N4
padding-left (não herdado) Ajusta o preenchimento no lado esquerdo do conteúdo de um elemento tamanho (pt, in, cm, px) ou porcentagem do tamanho da fonte { padding-left: 5pt }
IE4
N4
border-top-width (não herdado) Ajusta a largura da borda ao longo da parte de cima de um elemento tamanho (pt, in, cm, px);
thin, medium, thick
{ border-top-width: thin }
IE4
N4
border-right-width (não herdado) Ajusta a largura da borda ao longo do lado direito de um elemento tamanho (pt, in, cm, px);
thin, medium, thick
{ border-right-width: thin }
IE4
N4
border-bottom-width (não herdado) Ajusta a largura da borda ao longo da parte de baixo de um elemento tamanho (pt, in, cm, px);
thin, medium, thick
{ border-bottom-width: thin }
IE4
N4
border-left-width (não herdado) Ajusta a largura da borda ao longo do lado esquerdo de um elemento tamanho (pt, in, cm, px);
thin, medium, thick
{ border-left-width: thin }
IE4
N4
border-width (não herdado) Ajusta a largura da borda em cada lado de um elemento na ordem parte de cima, lado direito, parte de baixo, lado esquerdo (Se houver só um valor, ele se aplica a todos os lados; se houver dois ou três, os valores que faltam serão tomados do lado oposto.) tamanho (pt, in, cm, px);
thin, medium, thick
{ border-width: thin thin thick thin }
IE4
border-top-color (não herdado) Ajusta a cor da borda ao longo do lado de cima de um elemento nome da cor ou código hex { border-top-color: green }
IE4
border-right-color (não herdado) Ajusta a cor da borda ao longo do lado direito de um elemento nome da cor ou código hex { border-right-color: green }
IE4
border-bottom-color (não herdado) Ajusta a cor da borda ao longo do lado de baixo de um elemento nome da cor ou código hex { border-bottom-color: #00FF00 }
IE4
border-left-color (não herdado) Ajusta a cor da borda ao longo do lado esquerdo de um elemento nome da cor ou código hex { border-left-color: thin }
IE4
N4
border-color (não herdado) Ajusta a cor da borda em cada lado de um elemento na ordem parte de cima, lado direito, parte de baixo, lado esquerdo (Se houver só um valor, ele se aplica a todos os lados; se houver dois ou três, os valores que faltam serão tomados do lado oposto; note que o Netscape só permite um valor) nome da cor ou código hex { border-color: green #FFFF00 #00FFFF green } (IE4)
{ border-color: green } (IE4 or Netscape 4)
IE4
border-top-style (não herdado) Ajusta o estilo da borda ao longo do lado de cima de um elemento nome do estilo (none, solid, double, groove, ridge, inset, outset) { border-top-style: ridge }
IE4
border-right-style (não herdado) Ajusta o estilo da borda ao longo do lado direito de um elemento nome do estilo (none, solid, double, groove, ridge, inset, outset) { border-right-style: solid }
IE4
border-bottom-style (não herdado) Ajusta o estilo da borda ao longo do lado de baixo de um elemento nome do estilo (none, solid, double, groove, ridge, inset, outset) { border-bottom-style: groove }
IE4
border-left-style (não herdado) Ajusta o estilo da borda ao longo do lado esquerdo de um elemento nome do estilo (none, solid, double, groove, ridge, inset, outset) { border-left-style: inset }
IE4
N4
border-style (não herdado) Ajusta o estilo da borda em todos os lados de um elemento nome do estilo (none, solid, double, groove, ridge, inset, outset) { border-style: outset }
IE4
border-top (não herdado) Ajusta a largura, cor, e estilo da borda ao longo do lado de cima de um elemento largura, cor, e estilo { border-top: thin green ridge }
IE4
border-right (não herdado) Ajusta a largura, cor, e estilo da borda ao longo do lado direito de um elemento largura, cor, e estilo { border-right: thin green ridge }
IE4
border-bottom (não herdado) Ajusta a largura, cor, e estilo da borda ao longo do lado de baixo de um elemento largura, cor, e estilo { border-bottom: thin green ridge }
IE4
border-left (não herdado) Ajusta a largura, cor, e estilo da borda ao longo do lado esquerdo de um elemento largura, cor, e estilo { border-left: thin green ridge }
IE4
border (não herdado) Ajusta a largura, cor, e estilo da borda em todos os lados de um elemento largura, cor, e estilo { border: thin green ridge }
IE4
N4
float (não herdado) Faz com que o elemento flutue para um lado e outro do texto e o envolva. (Usado nos elementos DIV e SPAN.) left, right, ou none { float: left }
IE4
N4
clear (não herdado) Especifica se o elemento pode ter elementos flutuando à sua volta -- faz com que o elemento se posicione por baixo de qualquer elemento que esteja flutuando no lado especificado. left, right, ou both { clear: left }

[Página prévia] [Próxima página] [Seção página de conteúdo]