• Revista PROGRAMAR: Já está disponível a edição #53 da revista programar. Faz já o download aqui!

skin

[CSS] Atalhos e Atributos

3 mensagens neste tópico

Alguns atributos de CSS lhe permitem fazer diversas configurações em uma declaração. Por exemplo, suponha que você queira definir diversos aspectos da fnte utilizada para tags H1, como segue:

    H1 {font-style: italic;
   font-weight: bold;
   font-size: 18pt;
   font-family: 'Times Roman'}

Como alternativa a especificar todas essas formatações de fonte individualmente, você pode utilizar o atributo font: para defini-las todas de uma só vez, assim:

    H1 {font: italic bold 18pt 'Times Roman'}

Note como diversos valores - itálico, negrito, 18pt e Times Roman - são separados apenas por um espaço em branco. Essas regras abreviadas certamente poupam espaço e tempo de digitação.

Atributos de CSS a partir do Internet Explorer 4

Atributo de CSS O que ele formata

background - Cor de fundo, imagem, transparência.

background-attachment - Rolagem do fundo / Marca d'água.

background-image - Imagem de fundo.

background-color - Cor de fundo ou transparência.

background-position - Posicionamento da imagem de fundo.

background-repeat - Configuração lado-a-lado da imagem de fundo.

border - Largura, estilo e cor de todas as 4 bordas.

border-bottom - Largura, estilo e cor da borda inferior.

border-bottom-color - Cor da citada borda.

border-bottom-style - Estilo da citada borda.

border-bottom-width - Largura da citada borda.

border-color - Cor das 4 bordas.

border-left - Largura, estilo e cor da borda esquerda.

border-left-color - Cor da borda citada.

border-left-style - Estilo da borda citada.

border-left-width - Largura da borda citada.

border-right - Largura, estilo e cor da borda direita.

border-right-color - Cor da borda citada.

border-right-style - Estilo da borda citada.

border-right-width - Largura da borda citada.

border-style - Estilo de todas as 4 bordas.

border-top - Largura, estilo e cor da borda superior.

border-top-color - Cor da borda citada.

border-top-style - Estilo da borda citada.

border-top-width - Largura da borda citada.

border-width - Largura de todas as 4 bordas.

clear - Elementos flutuantes à esquerda ou à direita de um elemento.

clip - Parte visível de um elemento.

color - Cor de primeiro plano.

cursor - Tipo de ponteiro do mouse.

display - Se o elemento é exibido e o espaço é reservado para ele.

filter - Tipo de filtro aplicado ao elemento.

float - Se o elemento flutua.

font - Estilo, variante, peso, tamanho e altura da linha do tipo de fonte.

@font-face - Incorporação da fonte ao arquivo HTML.

font-family - Tipo de fonte.

font-size - Tamanho da fonte.

font-style - Fonte itálico.

Fonte-variant - Fonte bold.

font-weight - Peso da fonte de claro a negrito.

height - Altura exibida ao elemento.

@import - Folha de estilo a importar.

left - Posição do elemento em relação a margem esquerda da página.

letter-spacing - Distância entre as letras.

line-height - Distância entre linhas de base.

list-style - Tipo, imagem e posição do estilo da lista.

list-style-image - Marcador de item de lista.

list-style-position - Posição do marcador de item da lista.

list-style-type - Marcador de item de lista alternativo.

margin - Tamanho de todas as 4 margens.

margin-left - Tamanho da margem esquerda.

margin-right - Tamanho da margem direita.

margin-bottom - Tamanho da margem inferior.

margin-top - Tamanho da margem superior.

overflow - Exibição de imagens que são maiores do que suas molduras.

padding - Espaço em torno de um elemento em todos os lados.

padding-bottom - Espaço a partir da margem inferior de um elemento.

padding-left - Espaço à esquerda do elemento.

padding-right - Espaço à direita do elemento.

padding-top - Espaço a partir da margem superior do elemento.

page-break-after - Inserir quebra de página depois de um elemento.

page-break-before - Inserir quebra de página antes de um elemento.

position - Como o elemento é posicionado na página.

text-align - Alinhamento do texto.

text-decoration - Sublinhado, sobrelinhado ou riscado.

text-indent - Recuo da primeira linha do parágrafo.

text-transform - Transformação para todas maiúsculas, minúsculas ou inicial maiúscula.

top - Posição do elemento em relação a parte superior da página.

vertical-align - Alinhamento vertical do elemento.

visibility - Se elemento é visível ou invisível.

width - Largura do elemento.

z-index - Posição do elemento na pilha.

Fonte: Supertrafego

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

Passo a informar que é bastante importante a apresentação da fonte original de copias que fassam de outros sites para o forum.

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

Alguns atributos de CSS lhe permitem fazer diversas configurações em uma declaração. Por exemplo, suponha que você queira definir diversos aspectos da fnte utilizada para tags H1, como segue:

    H1 {font-style: italic;

    font-weight: bold;

    font-size: 18pt;

    font-family: 'Times Roman'}

Como alternativa a especificar todas essas formatações de fonte individualmente, você pode utilizar o atributo font: para defini-las todas de uma só vez, assim:

    H1 {font: italic bold 18pt 'Times Roman'}

Note como diversos valores - itálico, negrito, 18pt e Times Roman - são separados apenas por um espaço em branco. Essas regras abreviadas certamente poupam espaço e tempo de digitação.

Atributos de CSS a partir do Internet Explorer 4

Atributo de CSS O que ele formata

background Cor de fundo, imagem, transparência.

background-attachment Rolagem do fundo / Marca d'água.

background-image Imagem de fundo.

background-color Cor de fundo ou transparência.

background-position Posicionamento da imagem de fundo.

background-repeat Configuração lado-a-lado da imagem de fundo.

border Largura, estilo e cor de todas as 4 bordas.

border-bottom Largura, estilo e cor da borda inferior.

border-bottom-color Cor da citada borda.

border-bottom-style Estilo da citada borda.

border-bottom-width Largura da citada borda.

border-color Cor das 4 bordas.

border-left Largura, estilo e cor da borda esquerda.

border-left-color Cor da borda citada.

border-left-style Estilo da borda citada.

border-left-width Largura da borda citada.

border-right Largura, estilo e cor da borda direita.

border-right-color Cor da borda citada.

border-right-style Estilo da borda citada.

border-right-width Largura da borda citada.

border-style Estilo de todas as 4 boras.

border-top Largura, estilo e cor da borda superior.

border-top-color Cor da borda citada.

border-top-style Estilo da borda citada.

border-top-width Largura da borda citada.

border-width Largura de todas as 4 bordas.

clear Elementos flutuantes à esquerda ou à direita de um elemento.

clip Parte visível de um elemento.

color Cor de primeiro plano.

cursor Tipo de ponteiro do mouse.

display Se o elemento é exibido e o espaço é reservado para ele.

filter Tipo de filtro aplicado ao elemento.

float Se o elemento flutua.

font Estilo, variante, peso, tamanho e altura da linha do tipo de fonte.

@font-face Incorporação da fonte ao arquivo HTML.

font-family Tipo de fonte.

font-size Tamanho da fonte.

font-style Fonte itálico.

Fonte-variant Fonte bold.

font-weight Peso da fonte de claro a negrito.

height Altura exibida ao elemento.

@import Folha de estilo a importar.

left Posição do elemento em relação a margem esquerda da página.

letter-spacing Distância entre as letras.

line-height Distância entre linhas de base.

list-style Tipo, imagem e posição do estilo da lista.

list-style-image Marcador de item de lista.

list-style-position Posição do marcador de item da lista.

list-style-type Marcador de item de lista alternativo.

margin Tamanho de todas as 4 margens.

margin-left Tamanho da margem esquerda.

margin-right Tamanho da margem direita.

margin-bottom Tamanho da margem inferior.

margin-top Tamanho da margem superior.

overflow Exibição de imagens que são maiores do que suas molduras.

padding Espaço em torno de um elemento em todos os lados.

padding-bottom Espaço a partir da margem inferior de um elemento.

padding-left Espaço à esquerda do elemento.

padding-right Espaço à direita do elemento.

padding-top Espaço a partir da margem superior do elemento.

page-break-after Inserir quebra de página depois de um elemento.

page-break-before Inserir quebra de página antes de um elemento.

position Como o elemento é posicionado na página.

text-align Alinhamento do texto.

text-decoration Sublinhado, sobrelinhado ou riscado.

text-indent Recuo da primeira linha do parágrafo.

text-transform Transformação para todas maiúsculas, minúsculas ou inicial maiúscula.

top Posição do elemento em relação a parte superior da página.

vertical-align Alinhamento vertical do elemento.

visibility Se elemento é visível ou invisível.

width Largura do elemento.

z-index Posição do elemento na pilha.

Fonte:

Supertrafego

olha uma cena, eu precebo bem o que esstá aí, mas ficava mais fixe, separares o atributo da descrição, por um "-" ou mudar o atributo de cor, ou as 2 cenas :D

0

Partilhar esta mensagem


Link para a mensagem
Partilhar noutros sites

Crie uma conta ou ligue-se para comentar

Só membros podem comentar

Criar nova conta

Registe para ter uma conta na nossa comunidade. É fácil!


Registar nova conta

Entra

Já tem conta? Inicie sessão aqui.


Entrar Agora