Atributo | Descrição |
{ background: trasparent | color || url || repeat || scroll || posição } |
Especifica a transparência / cor/ imagem/ url da imagem/ posição da imagem/ repetição da imagem do plano de fundo do documento |
{ background-attachment: scroll | fixed } | Define se a imagem de fundo rolará com o conteúdo ou será fixa |
{ background-color: color | transparent } | Indica a cor e transparência da cor do plano de fundo |
{ background-image: url | none } | Espeficida o url da imagem de plano de fundo |
{ background-position: [ posição ] | largura | {1,2} | [ top | center | bottom ] || [ left | center | right ]} |
Indica a posição inicial da imagem de fundo do documento |
Indica a posição inicial da imagem de fundo do documento em relação ao eixo X. |
|
Indica a posição inicial da imagem de fundo do documento em relaçao ao eixo Y. |
|
{ background-repeat: repeat | repeat-x | repeat-y | no-repeat } |
Define como e se a imagem de fundo se repete. |
{ border: largura || estilo || color } | Define a largura, estilo e cor de todas as quatro bordas |
{ border-bottom: largura || estilo || color } |
Define a largura, estilo e cor da borda inferior |
{ border-bottom-color: color } | Define a cor da borda inferior |
{ border-bottom-style: none | solid | double | groove | ridge | inset | outset } |
Define o estilo da borda inferior |
{ border-bottom-width: thin | medium | thick | largura com unidade de medida específica } | Define a largura da borda inferior |
{ border-color: color {1,4} } | Define a cor de todas as bordas |
{ border-left: largura || estilo || color } |
Define a largura, estilo e cor da borda esquerda |
{ border-left-color: color } | Define a cor da borda esquerda |
{ border-left-style: none | solid | double | groove | ridge | inset | outset } |
Define o estilo da borda esquerda |
{ border-left-width: thin | medium | thick | largura } | Define a largura da borda esquerda. |
{ border-right: largura || estilo || color } |
Define a largura, estilo e cor da borda direita |
{ border-right-color: color } | Especifica a cor da borda direita. |
{ border-right-style: none | solid | double | groove | ridge | inset | outset } |
Define o estilo da borda direita. |
{ border-right-width: thin | medium | thick | largura } | Define a largura da borda direita. |
{ border-style: none | solid | double | groove | ridge | inset | outset } |
Define o estilo da borda. |
{ border-top: largura || estilo || color } |
Define a largura, estilo e cor da borda superior |
{ border-top-color: color } | Define a cor da borda superior |
{ border-top-style: none | solid | double | groove | ridge | inset | outset } |
Define o estilo da borda superior |
{ border-top-width: thin | medium | thick | largura } | Define a largura da borda superior |
{ border-width: [ thin | medium | thick | largura ] {1,4} } |
Especifica a largura de todas as bordas de um elemento |
{ clear: none | left | right | both } | Diz em qual lado do elemento não é permitido elementos flutuantes – ou com estilo float. |
{ clip: coordenadas top right bottom left | auto } | Especifica a parte visível do elemento – age como uma espécie de recorte. Só funciona para elementos posicionados de maneira fixed ou absolute e overflow independe de posicionamento |
{ color: color } | Especifica a cor do texto. |
{ cursor: auto | crosshair | default | hand | move | e-resize | ne-resize | nw-resize | n-resize | se-rezise | sw-resize | s-rezise | w-reseze | text | wait | help } |
Define o tipo do ponteiro/cursor do mouse. |
{ display: none | texto_vazio } | Determina se um elemento estará visível e reserva um espaço para o mesmo. |
{ font-family: [ nome da fonte | familia-genérica ] |
Estabelece os tipos de fonte que serão utilizados no elemento. |
{ filter: blendtrans | revealtrans | alpha | blur | croma | dropshadow | fliph | flipv | glow | gray | invert | light | mask | shadow | wave | xray } |
Define o tipo de filtro a ser aplicado em um elemento. |
{ font: [ estilo || variante || bold? ] tamanho [ primeira letra maiúscula?] família de fontes ] } | Define os atributos da fonte de um elemento |
{ font-family: familia de fonte} | Determina uma família de fontes a ser utilizada. |
{ font-size: xx-large | x-large | large | medium | small | x-small | xx-small | larger | smaller | porcentagem | tamanho } |
Determina o tamanho da fonte |
{ font-style: normal | italic | oblique } | Estabelece o estilo da fonte |
{ font-variant: normal | small-caps } | Especifica se a primeira letra de cada palavra deverá ter letras maiúsculas ou não. |
{ font-weight: normal | bold | bolder | lighter | 100 | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900 } |
Especifica quão grossa é a fonte, caso o estilo bold seja ativado. |
{ height: tamanho | auto } | Especifica a altura de um elemento |
{ left: tamanho | porcentagem | auto } | Especifica a posição esquerda de um elemento. |
{ margin-left: tamanho | porcentagem | auto } |
Especifica o tamanho da margem esquerda de um elemento. |
{ letter-spacing: normal | tamanho } | Determina o espaço entre os caracteres de texto. |
{ line-height: normal | tamanho | porcentagem } |
Determina a distância entre as linhas de texto adjacentes. |
{ list-style: tipo || posição || URL } |
Permite estabelecer o estilo de uma lista <LI> |
{ list-style-image: URL | none } | Define a imagem que será utilizada como marcador em uma lista (<LI>). |
{ list-style-position: inside | outside } | Estabelece a posiçao aonde uma lista do tipo (<LI>) será exibida. |
{ list-style-type: disk | circle | square | decimal | lower-roman | lower-alpha | upper-alpha | none } |
Caso não se utilize uma imagem como marcador de uma lista <LI>, define o estilo dos marcadores pré-definidos. |
{ margin: [ tamanho | porcentagem | auto ] {1,4} } |
Permite especificar as quatro margens de um documento. |
{ margin-bottom: tamanho | porcentagem | auto } |
Especifica o tamanho da margem inferior de um elemento. |
{ margin-left: tamanho | porcentagem | auto } |
Especifica o tamanho da margem esquerda de um elemento. |
{ margin-right: tamanho | porcentagem | auto } |
Especifica o tamanho da margem direita de um elemento. |
{ margin-top: tamanho | porcentagem | auto } |
Especifica o tamanho da margem superior de um elemento. |
{ overflow: none | clip | scroll } | Define como será exibida uma imagem ou texto que é maior que sua moldura. |
{ padding: [ tamanho | porcentagem ] {1,4} } |
Estabelece um espaço interno em torno de um elemento em todos os lados. |
{ padding-bottom: tamanho | porcentagem } |
Estabelece um espaço interno em torno de um elemento, abaixo. |
{ padding-left: tamanho | porcentagem } | Estabelece um espaço interno em torno de um elemento, à sua esquerda. |
{ padding-right: tamanho | porcentagem } |
Estabelece um espaço interno em torno de um elemento, à sua direita. |
{ padding-top: tamanho | porcentagem } | Estabelece um espaço interno em torno de um elemento, em cima do mesmo. |
{ page-break-after: auto | always left | right } | Ao imprimir um documento, após imprimir esse elemento, será aplicada uma quebra de página. |
{ page-break-before: auto | always left | right } | Ao imprimir um documento, antes de imprimir esse elemento, será aplicada uma quebra de página. |
{ height: tamanho | porcentagem | auto } |
Determina a altura de um elemento. |
{ position: absolute | relative | static } | Determina como o elemento está posicionado na página. |
{ float: left | right | none } | Determina com o elemento flutuará na página. |
{ text-align: left | right | center | justify } | Especifica o alinhamento do texto. |
{ text-decoration: none |[ underline || overline || line-through] } | Especifica um tipo de decoração para o texto. |
{ text-indent: tamanho | porcentagem } | Récuo da primeira linha do parágrafo. |
{ text-transform: capitalize | uppercase | lowercase | none } |
Especifica como o texto será captalizado. |
{ top: tamanho | porcentagem | auto } | Determina a posição superior do elemento. |
{ vertical-align: baseline | sub | super | top | text-top | middle | bottom | text-bottom | porcentagem } |
Determina o alinhamento vertical de um elemento. |
{ visibility: visible | hidden | inherit } | Especifica se o elemento estará visível. |
{ width: tamanho | porcentagem | auto } | Especifica a largura de um elemento. |
{ z-index: número } | Estabelece a posição do elemento em uma pilha – se está por cima ou por baixo de outros elementos. É muito utilizado em menus. |
// Comente!
comentários