Propriedades CSS - Guia de Referncia

Pgina Inicial Criao de Websites Noes de SQL Downloads Links teis Hora do Caf Entrar em Contato

Tutoriais HTML Bsico CSS Bsico JavaScript Bsico XML Bsico Guias de Referncia Elementos HTML Propriedades CSS Seletores CSS Tabela de Cores HTML/CSS Tabela de Caracteres Especiais Como especificar o path

Propriedades CSS - Guia de Referncia

Por Aires Bento Pereira Filho

Estamos apresentando as propriedades CSS em 13 tpicos. As informaes so as seguintes: 1. a propriedade; 2. descrio de sua finalidade; 3. indicao se herdada ou no; 4. indicao da especificao CSS (CSS1 ou CSS2); 5. verso do browser que a suporta (IE: Internet Explorer, F: Firefox, N: Netscape); 6. Possveis valores.

Tpicos: 1. Fundo 2. Bordas 3. Linhas de contorno 4. Margens 5. Espao em branco (padding) 6. Classificao (forma de exibio) 7. Posicionamento 8. Dimensionamento 9. Fonte 10. Texto 11. Listas e marcadores 12. Tabelas 13. Gerao de Contedo

1 - FUNDO Define todos os parmetros referentes ao fundo de um elemento. Aceita de 1 a 5 valores. background Valores: background-color | background-image | backgroundrepeat | background-attachment | background-position Define a cor de fundo de um elemento. background-color Valores: nomecor | #rrggbb | #rgb | rgb(d,d,d) | rgb(d%,d%,d%) | transparent Define uma imagem como fundo de um elemento. background-image Valores: url | none Define se a imagem vai repetir (formando um mosaico) ou no e a direo da repetio. Valores: repeat | repeat-x | repeat-y | no-repeat backgroundattachment Define se a imagem de fundo de um elemento ficar fixa ou se ir rolar junto com o contedo. Valores: scroll | fixed Define o ponto onde inicia o desenho da imagem de fundo. background-position Valores: top left | top center | top right | center left | center center | center right | bottom left | bottom center | bottom right | x% y% | x unids_css y unids_css 2 - BORDAS Define o estilo, a espessura e a cor das 4 bordas. Aceita de 1 a 3 valores.
no no herdada CSS1 IE 4 F 1 N 6 no herdada no herdada CSS1 IE 4 F 1 N 4

no herdada

CSS1

IE 4 F 1 N 6

no herdada

CSS1

IE 4 F 1 N 4

background-repeat

no herdada

CSS1

IE 4 F 1 N 4

CSS1

IE 4 F 1 N 6

border

CSS1

IE 4 F 1 N 4

http://www.abpsoft.com/criacaoweb/cssguiaref.html[11/08/2011 15:55:44]

Propriedades CSS - Guia de Referncia herdada

Valores: border-style | border-width | border-color border-top border-right border-bottom border-left border-top-style border-top-width border-top-color border-right-style border-right-width border-right-color border-bottom-style border-bottom-width border-bottom-color border-left-style border-left-width border-left-color Definem o estilo, a espessura e a cor das bordas superior, direita, inferior e esquerda. Aceitam de 1 a 3 valores. Valores: border-style | border-width | border-color Definem o estilo, a espessura e a cor da borda superior. Aceitam de 1 a 3 valores. Valores: border-style | border-width | border-color Definem o estilo, a espessura e a cor da borda direita. Aceitam de 1 a 3 valores. Valores: border-style | border-width | border-color
CSS2 no CSS1 herdadas CSS2 CSS2 no CSS1 herdadas CSS2 CSS2 CSS1 herdadas CSS2 CSS2 no CSS1 herdadas CSS2 IE 4 F 1 N 6 IE 4 F 1 N 4 IE 4 F 1 N 6 IE 4 F 1 N 6 IE 4 F 1 N 4 IE 4 F 1 N 6 IE 4 F 1 N 6 IE 4 F 1 N 4 IE 4 F 1 N 6 IE 4 F 1 N 6 IE 4 F 1 N 4 IE 4 F 1 N 6 no CSS1 herdadas

IE 4 F 1 N 6

Definem o estilo, a espessura e a cor da borda inferior. Aceitam no de 1 a 3 valores. Valores: border-style | border-width | border-color Definem o estilo, a espessura e a cor da borda esquerda. Aceitam de 1 a 3 valores. Valores: border-style | border-width | border-color Define o estilo das 4 bordas. Aceita de 1 a 4 valores.

border-style

no

Valores: none | hidden | dotted | dashed | solid | double | groove herdada | ridge | inset | outset Define a espessura das 4 bordas. Aceita de 1 a 4 valores.
no herdada no herdada

CSS1

IE 4 F 1 N 6

border-width Valores: thin | medium | thick | unids_css Define a cor das 4 bordas. Aceita de 1 a 4 valores. border-color Valores: nomecor | #rrggbb | #rgb | rgb(d,d,d) | rgb(d%,d%,d%) 3 - LINHAS DE CONTORNO

CSS1

IE 4 F 1 N 4

CSS1

IE 4 F 1 N 6

outline

Define o estilo, a espessura e a cor da linha de contorno. Aceita no de 1 a 3 valores.

herdada

CSS2

IE -- F 1.5 N -

Valores: outline-style | outline-width | outline-color Define o estilo da linha de contorno. outline-style

no IE -- F 1.5 N -

Valores: none | hidden | dotted | dashed | solid | double | groove herdada | ridge | inset | outset Define a espessura da linha de contorno.
no herdada

CSS2

outline-width Valores: thin | medium | thick | unids_css Define a cor da linha de contorno. outline-color Valores: nomecor | #rrggbb | #rgb | rgb(d,d,d) | rgb(d%,d%,d%) | invert 4 - MARGENS Define as 4 margens do elemento. Aceita de 1 a 4 valores. margin Valores: margin-top | margin-right | margin-bottom | margin-left
http://www.abpsoft.com/criacaoweb/cssguiaref.html[11/08/2011 15:55:44]

CSS2

IE -- F 1.5 N -

no herdada

CSS2

IE -- F 1.5 N -

no herdada

CSS1

IE 4 F 1 N 4

Propriedades CSS - Guia de Referncia

margin-top margin-right margin-bottom margin-left

Definem as margens superior, direita, inferior e esquerda. Valores: auto | unids_css | % 5 - ESPAO EM BRANCO (PADDING) Define o espao entre o contedo e os 4 limites do elemento. Aceita de 1 a 4 valores.
no CSS1 herdadas

IE IE IE IE

3 3 4 3

F F F F

1 1 1 1

N4 N4 N4 N4

padding Valores: padding-top | padding-right | padding-bottom | paddingleft padding-top padding-right padding-bottom padding-left Definem o espao entre o contedo e os limites superior, direito, inferior e esquerdo. Valores: unids_css | % 6 - CLASSIFICAO (FORMA DE EXIBIO) Define os lados de um elemento onde no so permitidos elementos flutuantes. Valores: left | right | both | none Define um formato para o cursor. cursor

no herdada

CSS1

IE 4 F 1 N 4

no CSS1 herdadas

IE 4 F 1 N 4

clear

no herdada

CSS1

IE 4 F 1 N 4

Valores: url | auto | crosshair | default | pointer | move | e-resize no herdada | ne-resize | nw-resize | n-resize | se-resize | sw-resize | sresize | w-resize | text | wait | help Define se um elemento deve ser apresentado e a forma de apresentao.

CSS2

IE 4 F 1 N 6

display

Valores: none | inline | block | list-item | run-in | compact | marker | table | inline-table | table-row-group | table-headergroup | table-footer-group | table-row | table-column-group | table-column | table-cell | table-caption Define o alinhamento de um elemento e controla o fluxo de texto ou de outros elementos ao seu redor. Valores: left | right | none Define a posio de um elemento como esttica, relativa, absoluta ou fixa. Valores: static | relative | absolute | fixed Define se um elemento deve ficar visvel ou invisvel.

no herdada

CSS1

IE 4 F 1 N 4

float

no herdada

CSS1

IE 4 F 1 N 4

position

no herdada

CSS1

IE 4 F 1 N 4

visibility Valores: visible | hidden | collapse 7 - POSICIONAMENTO top right bottom left Definem a distncia do elemento em relao ao limite do elemento que o contm. Valores: auto | unids_css | % Define o alinhamento vertical do elemlento. vertical-align

no herdada

CSS2

IE 4 F 1 N 4

no CSS2 herdadas

IE IE IE IE

4 5 5 4

F F F F

1 1 1 1

N4 N6 N6 N4

no

Valores: baseline | sub | super | top | text-top | middle | bottom | herdada text-bottom | unids_css | %

CSS1

IE 4 F 1 N 4

http://www.abpsoft.com/criacaoweb/cssguiaref.html[11/08/2011 15:55:44]

Propriedades CSS - Guia de Referncia

Define a forma de um elemento. clip Valores: auto | shape Define o que deve ocorrer quando o contedo de um elemento excede sua rea. Valores: visible | hidden | scroll | auto Define a ordem de apresentao dos elementos quando h sobreposio. Valores: auto | nmero 8 - DIMENSIONAMENTO width height max-width max-height min-width min-height Definem a largura e a altura de um elemento. Valores: auto | unids_css | % Definem a largura mxima e a altura mxima de um elemento. Valores: none | unids_css | % Definem a largura mnima e a altura mnima de um elemento. Valores: unids_css | % Define a distncia entre linhas de texto. line-height Valores: normal | nmero | unids_css | % 9 - FONTE Define vrios valores da fonte. font Valores: font-family | font-size/line-height | font-style | fontweight | font-variant | caption | icon | menu | message-box | small-caption | status-bar Define o tipo de fonte. font-family Valores: family-name | generic-family Define o tamanho da fonte. font-size

no herdada

CSS2

IE 4 F 1 N 6

overflow

no herdada

CSS2

IE 4 F 1 N 6

z-index

no herdada

CSS2

IE 4 F 1 N 6

no CSS1 herdadas no CSS2 herdadas no CSS2 herdadas

IE 4 F 1 N 4 IE 4 F 1 N 6 IE -- F 1 N 6 IE -- F 1 N 6 IE -- F 1 N 6 IE -- F 1 N 6

herdada

CSS1

IE 4 F 1 N 4

herdada

CSS1

IE 4 F 1 N 4

herdada

CSS1

IE 3 F 1 N 4

Valores: xx-small | x-small | small | medium | large | x-large | xx- herdada large | smaller | larger | unids_css | % Define o estilo da fonte.
herdada

CSS1

IE 3 F 1 N 4

font-style Valores: normal | italic | oblique Define a espessura do trao da fonte. font-weight Valores: normal | bold | bolder | lighter | 100 | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900 Define que o tamanho da fonte deve ser ajustado, caso o browser tenha de utilizar outro tipo de fonte que no o escolhido em font-family. Valores: none | nmero Define se deve ser utilizado um tipo de fonte "small-caps" ou normal.

CSS1

IE 4 F 1 N 4

herdada

CSS1

IE 4 F 1 N 4

font-size-adjust

herdada

CSS2

IE -- F -- N --

font-variant

herdada

CSS1

IE 4 F 1 N 6

http://www.abpsoft.com/criacaoweb/cssguiaref.html[11/08/2011 15:55:44]

Propriedades CSS - Guia de Referncia

Valores: normal | small-caps Define uma contrao ou expanso na largura da fonte. font-stretch Valores: normal | wider | narrower | ultra-condensed | extracondensed | condensed | semi-condensed | semi-expanded | expanded | extra-expanded | ultra-expanded 10 - TEXTO Define a cor do texto. color Valores: nomecor | #rrggbb | #rgb | rgb(d,d,d) | rgb(d%,d%,d%) Define o alinhamento do texto. text-align Valores: left | right | center | justify Define um deslocamento para a direita ou esquerda da primeira linha do texto. herdada Valores: unids_css | % Define um efeito decorativo para o texto. text-decoration Valores: none | underline | overline | line-through | blink Define que o texto deve ser capitalizado ou ser exibido todo em maisculas ou minsculas. herdada Valores: none | capitalize | uppercase | lowercase letter-spacing word-spacing Definem um aumento ou diminuio no espao entre os caracteres ou entre as palavras. Valores: normal | unids_css Define o tratamento a ser dado ao espao em branco existente dentro de um elemento. Valores: normal | pre | nowrap Define a direo em que escrito o texto. Da esquerda para a direita ou da direita para a esquerda. Valores: ltr | rtl 11 - LISTAS E MARCADORES Define todos os parmetros referentes a uma lista. Aceita de 1 a 3 valores. Valores: list-style-type | list-style-position | list-style-image Define o tipo de marcador de item da lista. Valores: none | disc | circle | square | decimal | decimal-leadingzero | lower-roman | upper-roman | lower-alpha | upper-alpha | no herdada lower-greek | lower-latin | upper-latin | hebrew | armenian | georgian | cjk-ideographic | hiragana | katakana | hiragana-iroha | katakana-iroha Define a posio do marcador de item da lista. list-style-position Valores: inside | outside
no herdada no herdada IE 4 F 1 N 6 IE 6 F 1 N 6 herdada CSS1 IE 4 F 1 N 4 herdada CSS1 IE 4 F 1 N 4 herdada CSS1 IE 3 F 1 N 4 herdada CSS2 IE -- F -- N --

text-indent

CSS1

IE 4 F 1 N 4

text-transform

CSS1

IE 4 F 1 N 4

herdadas CSS1

white-space

herdada

CSS1

IE 5 F 1 N 4

direction

herdada

CSS2

IE 6 F 1 N 6

list-style

CSS1

IE 4 F 1 N 6

list-style-type

CSS1

IE 4 F 1 N 4

CSS1

IE 4 F 1 N 6

http://www.abpsoft.com/criacaoweb/cssguiaref.html[11/08/2011 15:55:44]

Propriedades CSS - Guia de Referncia

list-style-image

Define a imagem a ser utilizada como marcador de item da lista. Valores: none | url 12 - TABELAS Define se os traos das bordas sero fundidos ou mantidos separados. Valores: collapse | separate Define a distncia entre as bordas de clulas adjacentes. S aplicvel quando border-collapse for separate. Valores: unids_css Define se as clulas sem contedo visvel devem ter bordas ou no. S aplicvel quando border-collapse for separate. Valores: show | hide Define a posio da legenda na tabela.

no herdada

CSS1

IE 4 F 1 N 6

border-collapse

no herdada

CSS2

IE 5 F 1 N 7

border-spacing

no herdada

CSS2

IE 5M F 1 N 6

empty-cells

no herdada

CSS2

IE 5M F 1 N 6

caption-side Valores: top | bottom | left | right Define como ser desenhada a tabela table-layout Valores: auto | fixed 13 - GERAO DE CONTEDO Gera contedo para um elemento. Utilizada com os pseudoelementos :before e :after. content Valores: string | url | counter(name) | counter(name, list-styletype) | counters(name, string) | counters(name, string, list-styletype) | attr(X) | open-quote | close-quote | no-open-quote | noclose-quote Define em quanto ser incrementado o contador a cada ocorrncia de um seletor. Valores: none | nmero identificador Define o valor a a ser atribudo ao contador a cada ocorrncia de um seletor. Valores: none | nmero identificador Define o estilo das aspas. quotes Valores: none | string string

no herdada no herdada

CSS2

IE 5M F 1 N 6

CSS2

IE 5 F 1 N 6

no herdada

CSS2

IE -- F 1 N 6

counter-increment

no herdada

CSS2

IE -- F -- N --

counter-reset

no herdada

CSS2

IE -- F -- N --

no herdada

CSS2

IE -- F 1 N 6

Copyright 2006 Abpsoft. Todos os direitos reservados.

| Mapa do Site |

http://www.abpsoft.com/criacaoweb/cssguiaref.html[11/08/2011 15:55:44]