Cores e fundos em CSS

As propriedades color e background especificam as cores dos textos (normalmente chamadas de foreground color) e as cores ou imagens aplicadas no fundo dos elementos (background), respectivamente. Neste post veja cores e fundos em CSS.

Abaixo estão listados essas propriedades e a descrição de suas funcionalidades. Veja:

color: Especifica a cor do texto contido no elemento:

body {color: #000000}
a {color: #0000FF}

background-color: Especifica a cor de fundo de um elemento:

h1 {background-color: #C8C8C8}
div span {background-color: #00F00F}
	
/*o valor "transparent" especifica que a cor do elemento pai deve ser utilizada como cor de fundo do elemento atual*/

background-image: Configura uma imagem como plano de fundo:

body {background-image: url(fundo.gif)}
div {background-image: url(tela.gif)}

background-repeat: Especifica como a imagem de fundo definida na propriedade background-image será repetida se o tamanho da mesma for menor que a área de apresentação do elemento:

body {background-repeat: repeat-y}
div {background-repeat: no-repeat}
    
/*repeat-x: a imagem será repetida somente no sentido horizontal, criando uma faixa horizontal entre as margens esquerda e direita do elemento */

background-attachment: Especifica se a imagem definida na propriedade background-image ficará fixa ou se acompanhará a rolagem da área de apresentação do navegador:

body {background-attachment: fixed}
div {background-attachment: scroll}

background-position: Essa propriedade especifica a posição inicial da imagem de fundo definida na propriedade background-image na área de apresentação do elemento. O par de coordenadas corresponde à posição inicial da imagem com relação aos eixos X (horizontal) e Y (vertical). Os valores padrão dessa propriedade são: 0% e 0%:

body {background-position: center top}
div {background-position: 10px 20px}

background: Essa propriedade é um atalho para especificar as propriedades background-color, background-image, background-repeat, background-attachment e background-position em um único local da folha de estilo. As propriedades que não tiverem valor fornecido, assumem o seu valor padrão:

body {background: #ff00f0 url(fundo.gif) no-repeat center top}
div {background: #fff0f0 url(tela.gif) repeat left top}

Bordas em CSS

Dúvidas ou sugestões? Deixem nos comentários! Para mais dicas, acesse o nosso canal no YouTube:
https://youtube.com/criandobits

Tags:

Seu computador está lento, travando ou dando tela azul? E toda vez que isso acontece você precisa gastar dinheiro com assistência técnica?

A verdade é que continuar sem esse conhecimento pode estar custando muito mais do que você imagina.

Você pode economizar centenas ou até milhares de reais ao longo do tempo fazendo você mesmo a manutenção dos seus computadores. E, se decidir prestar serviços, esse conhecimento também pode se transformar em uma fonte de renda, que pode variar de R$2.000 a R$5.000 por mês ou mais.

Tudo isso com aulas práticas, objetivas e focadas no que realmente funciona, sem enrolação:

✔ Resolver seus próprios problemas sem depender de ninguém
✔ Ganhar dinheiro com manutenção e suporte técnico
✔ Ou até entrar de vez no mercado de TI

A decisão é sua: continuar gastando dinheiro sempre que o computador apresentar um problema ou aprender uma habilidade que pode fazer você economizar e até gerar uma nova fonte de renda.

👉 CLIQUE AQUI AGORA e veja todos os detalhes antes que essa oportunidade passe:

Super Técnico 2.0

Sobre o Autor

Benedito Silva Júnior
Benedito Silva Júnior

Bacharel em Sistemas de Informação e apaixonado por tecnologias e games do tempo da vovó!

0 Comentários

Deixe um comentário

O seu endereço de e-mail não será publicado. Campos obrigatórios são marcados com *