CSS

Css 3

Background

Define todos os parâmetros referentes ao fundo de um elemento. Aceita de 1 a 5 valores.

Valores:

background-color

Define a cor de fundo de um elemento.

Valores:

• nomecor
• #rrggbb
• #rgb
• rgb(d,d,d)
• rgb(d%,d%,d%)
• transparent

background-image

Define uma imagem como fundo de um elemento.

Valores:

• url
• none

background-repeat

Define se a imagem vai repetir (formando um mosaico) ou não e a direção da repetição.

Valores:

• repeat
• repeat-x
• repeat-y
• no-repeat

background-attachment

Define se a imagem de fundo de um elemento ficará fixa ou se irá rolar junto com o conteúdo.

Valores:

• scroll
• fixed

background-position

Define o ponto onde inicia o desenho da imagem de fundo.

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

Border

Define o estilo, a espessura e a cor das 4 bordas. Aceita de 1 a 3 valores.

Valores:

border-style

Define o estilo das 4 bordas. Aceita de 1 a 4 valores.

Valores:

• none
• hidden
• dotted
• dashed
• solid
• double
• groove
• ridge
• inset
• outset

border-width

Define a espessura das 4 bordas. Aceita de 1 a 4 valores.

Valores:

• thin
• medium
• thick
• unids_css

border-color

Define a cor das 4 bordas. Aceita de 1 a 4 valores.

Valores:

• nomecor
• #rrggbb
• #rgb
• rgb(d,d,d)
• rgb(d%,d%,d%)

border-top

Definem o estilo, a espessura e a cor das bordas superiores. Aceita de 1 a 3 valores.

border-top-style

Define o estilo da borda superior.

Valores:

• none
• hidden
• dotted
• dashed
• solid
• double
• groove
• ridge
• inset
• outset

border-top-width

Define a espessura da borda superior.

Valores:

• thin
• medium
• thick
• unids_css

border-top-color

Define a cor da borda superior.

Valores:

• nomecor
• #rrggbb
• #rgb
• rgb(d,d,d)
• rgb(d%,d%,d%)

border-right

Definem o estilo, a espessura e a cor das bordas direitas. Aceita de 1 a 3 valores.

Valores:

border-right-style

Define o estilo da borda direita.

• none
• hidden
• dotted
• dashed
• solid
• double
• groove
• ridge
• inset
• outset

border-right-width

Define a espessura da borda direita.

Valores:

• thin
• medium
• thick
• unids_css

border-right-color

Define a cor da borda direita.

Valores:

• nomecor
• #rrggbb
• #rgb
• rgb(d,d,d)
• rgb(d%,d%,d%)

border-left

Definem o estilo, a espessura e a cor das bordas esquerdas. Aceita de 1 a 3 valores.

Valores:

border-left-style

Define o estilo da borda esquerda.

• none
• hidden
• dotted
• dashed
• solid
• double
• groove
• ridge
• inset
• outset

border-left-width

Define a espessura da borda esquerda.

Valores:

• thin
• medium
• thick
• unids_css

border-left-color

Define a cor da borda esquerda.

Valores:

• nomecor
• #rrggbb
• #rgb
• rgb(d,d,d)
• rgb(d%,d%,d%)

border-bottom

Definem o estilo, a espessura e a cor das bordas inferiores. Aceita de 1 a 3 valores.

border-bottom-style

Define o estilo da borda inferior.

Valores:

• none
• hidden
• dotted
• dashed
• solid
• double
• groove
• ridge
• inset
• outset

border-bottom-width

Valores:

Define a espessura da borda inferior.

• thin
• medium
• thick
• unids_css

border-bottom-color

Define a cor da borda inferior.

Valores:

• nomecor
• #rrggbb
• #rgb
• rgb(d,d,d)
• rgb(d%,d%,d%)

Linhas de Contorno

outline

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

Valores:

• outline-style
• outline-width
• outline-color

outline-style

Define o estilo da linha de contorno.

Valores:

• none
• hidden
• dotted
• dashed
• solid
• double
• groove
• ridge
• inset
• outset

outline-width

Define a espessura da linha de contorno.

Valores:

• thin
• medium
• thick
• unids_css

outline-color

Define a cor da linha de contorno.

Valores:

• nomecor
• #rrggbb
• #rgb
• rgb(d,d,d)
• rgb(d%,d%,d%)
• invert

box-shadow

Atribui um efeito de sombra á fonte.

Sintaxe

seletor{
    box-shadow: A B C D E F;
}

Onde:

• A: Opção INSET ou OUTSET

 * INSET: Coloca a sombra pra dentro do elemento.
 * OUTSET: Coloca a sombra para o lado de fora da box (valor padrão).

• B: OFFSET X

Margens

margin

Define as 4 margens do elemento. Aceita de 1 a 4 valores.

Valores:

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

Definem as margens superior, direita, inferior e esquerda.

Valores:

• auto
• unids_css
• %

Espaçamento

Padding

Define o espaço entre o conteúdo e os 4 limites do elemento. Aceita de 1 a 4 valores.

Valores:

• padding-top
• padding-right
• padding-bottom
• padding-left

Definem o espaço entre o conteúdo e os limites superior, direito, inferior e esquerdo.

Valores:

• unids_css
• %

Exibição

clear

Define os lados de um elemento onde não são permitidos elementos flutuantes.

Valores:

• left
• right
• both
• none

cursor

Define um formato para o cursor.

Valores:

• url
• auto
• crosshair
• default
• pointer
• move
• e-resize
• ne-resize
• nw-resize
• n-resize
• se-resize
• sw-resize
• s-resize
• w-resize
• text
• wait
• help

Posicionamento

• top
• right
• bottom
• left

Definem a distância do elemento em relação ao limite do elemento que o contém.

Valores:

• auto
• unids_css
• %

vertical-align

Define o alinhamento vertical do elemlento.

Valores:

• baseline
• sub
• super
• top
• text-top
• middle
• bottom
• text-bottom
• unids_css
• %

clip

Define a forma de um elemento.

Valores:

• auto
• shape

overflow

Define o que deve ocorrer quando o conteúdo de um elemento excede sua área.

Valores:

• visible
• hidden
• scroll
• auto

z-index

Define a ordem de apresentação dos elementos quando há sobreposição.

Valores:

• auto
• número

Dimensionamento

• width
• height

Definem a largura e a altura de um elemento.

Valores:

• auto
• unids_css
• %

max-width

Define a largura máxima de um elemento.

Valores:

• none
• unids_css
• %

max-height

Define a altura máxima de um elemento.

Valores:

• none
• unids_css
• %

min-width

Define a largura mínima de um elemento.

Valores:

• unids_css
• %

min-height

Define a altura mínima de um elemento.

Valores:

• unids_css
• %

line-height

Define a distância entre linhas de texto.

Valores:

• normal
• número
• unids_css
• %

font

Define vários valores da fonte.

Valores:

• font-family
• font-size/line-height
• font-style
• font-weight
• font-variant
• captionicon |
• menu
• message-box
• small-caption
• status-bar

font-family

Define o tipo de fonte.

Valores:

• family-name
• generic-family

font-size

Define o tamanho da fonte.

Valores:

• xx-small
• x-small
• small
• medium
• large
• x-large
• xx-large
• smaller
• larger
• unids_css
• %

font-style

Define o estilo da fonte.

Valores:

• normal
• italic
• oblique

font-weight

Define a espessura do traço da fonte.

Valores:

• normal
• bold
• bolder
• lighter
• 100
• 200
• 300
• 400
• 500
• 600
• 700
• 800
• 900

font-size-adjust

Define que o tamanho da fonte deve ser ajustado, caso o browser tenha de utilizar outro tipo de fonte que não o escolhido em font-family.

Valores:

• none
• número

font-variant

Define se deve ser utilizado um tipo de fonte "small-caps" ou normal.

Valores:

• normal
• small-caps

font-stretch

Define uma contração ou expansão na largura da fonte.

Valores:

• normal
• wider
• narrower
• ultra-condensed
• extra-condensed
• condensed
• semi-condensed
• semi-expanded
• expanded
• extra-expanded
• ultra-expanded

Texto

color

Define a cor do texto.

Valores:

• nomecor
• #rrggbb
• #rgb
• rgb(d,d,d)
• rgb(d%,d%,d%)

text-align

Define o alinhamento do texto.

Valores:

• left
• right
• center
• justify

text-indent

Define um deslocamento para a direita ou esquerda da primeira linha do texto.

Valores:

• unids_css
• %

text-decoration

Define um efeito decorativo para o texto.

Valores:

• none
• underline
• overline
• line-through
• blink

text-transform

Define que o texto deve ser capitalizado ou ser exibido todo em maiúsculas ou minúsculas.

Valores:

none capitalize uppercase lowercase

letter-spacing

Define um aumento ou diminuição no espaço entre os caracteres.

Valores:

• normal
• unids_css

word-spacing

Definem um aumento ou diminuição no espaço entre as palavras.

Valores:

• normal
• unids_css

white-space

Define o tratamento a ser dado ao espaço em branco existente dentro de um elemento.

Valores:

• normal
• pre
• nowrap

direction

Define a direção em que é escrito o texto. Da esquerda para a direita ou da direita para a esquerda.

Valores:

• ltr
• rtl

Listas e Marcadores

list-style

Define todos os parâmetros referentes a uma lista. Aceita de 1 a 3 valores.

Valores:

• list-style-type
• list-style-position
• list-style-image

list-style-type

Define o tipo de marcador de item da lista.

Valores:

• none
• disc
• circle
• square
• decimal
• decimal-leading-zero
• lower-roman
• upper-roman
• lower-alpha
• upper-alpha
• lower-greek
• lower-latin
• upper-latin
• hebrew
• armenian
• georgian
• cjk-ideographic
• hiragana
• katakana
• hiragana-iroha
• katakana-iroha

list-style-position

Define a posição do marcador de item da lista.

Valores:

• inside
• outside

list-style-image

Define a imagem a ser utilizada como marcador de item da lista.

Valores:

• none
• url

Tabelas

border-collapse

Define se os traços das bordas serão fundidos ou mantidos separados.

Valores:

collapse | separate

border-spacing

Define a distância entre as bordas de células adjacentes. Só aplicável quando border-collapse for separate.

Valores:

unids_css

empty-cells

Define se as células sem conteúdo visível devem ter bordas ou não. Só aplicável quando border-collapse for separate.

Valores:

• show
• hide

caption-side

Define a posição da legenda na tabela.

Valores:

• top
• bottom
• left
• right

table-layout

Define como será desenhada a tabela.

Valores:

• auto
• fixed

Geração de Conteúdo

content

Gera conteúdo para um elemento. Utilizada com os pseudo-elementos :before e :after.

Valores:

string

• url
• counter(name)
• counter(name, list-style-type)
• counters(name,string)
• counters(name, string, list-style-type)
• attr(X)
• open-quote
• close-quote
• no-open-quote
• no-close-quote

counter-increment

Define em quanto será incrementado o contador a cada ocorrência de um seletor.

Valores:

• none
• número identificador

counter-reset

Define o valor a a ser atribuído ao contador a cada ocorrência de um seletor.

Valores:

• none
• número identificador

quotes

Define o estilo das aspas.

Valores:

• none
• string string

Fonte

WCS3