CSS: mudanças entre as edições

De RJGS Wiki
Ir para navegação Ir para pesquisar
Linha 367: Linha 367:
== Margens ==  
== Margens ==  


margin
=== margin ===


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


Valores:  
Valores:


* margin-top
* margin-top
Linha 384: Linha 384:
Definem as margens superior, direita, inferior e esquerda.
Definem as margens superior, direita, inferior e esquerda.


Valores:  
Valores:


* auto
* auto
* unids_css
* unids_css
* %
* %
== 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


== Fonte ==
== Fonte ==


WCS3
WCS3

Edição das 02h55min de 10 de setembro de 2024

Css 3

Propriedades

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
  • %

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

Fonte

WCS3