As propriedades background e background-color são as mesmas?
Você está vendo a versão anterior da nova experiência da Alura que estamos preparando para você. Em breve, ela ganha uma identidade visual novinha totalmente pensada em potencializar seus estudos!
Solucionado
As propriedades background e background-color são as mesmas?
Oi, Ricardo.
Não, a propriedade background é uma shorthand property. Ou seja, é uma propriedade que permite escrever múltiplas propriedades de uma vez só. Por exemplo, tenho o seguinte código:
.header {
background-image: url('fundo.jpg');
background-color: #000;
background-position: center top;
background-repeat: no-repeat;
}Graças à propriedade background, o mesmo código pode ser escrito de forma resumida:
.header {
background: url('fundo.jpg') #000 center top no-repeat;
}Ao passo que background-color aceita somente um valor para a cor.
No entanto, você pode utilizar as duas propriedades para atribuir uma cor de fundo. Veja:
/* Funciona */
.header {
background-color: tomato;
}.header {
/* Também funciona */
.header {
background: tomato;
}Links interessantes: - MDN - CSS Tricks