Solucionado
Olá,
Alguém consegue me explicar a diferença no CSS entre o background e background-color?
Usei nos dois formato no meu projeto e não mudou em nada tanto com background-color e somente background.
body {
background-color: var(--cor-de-fundo);
color: var(--branco-principal);
}body {
background: var(--cor-de-fundo);
color: var(--branco-principal);
}
Olá! Tudo bem? Basicamente, background-color serve somente para colocar alguma cor de fundo, enquanto o background serve para colocar várias propriedades de uma vez ou então adicionar algum tipo de efeito como um degradê. Veja alguns exemplos:
/* Colocando uma cor simples de fundo */
body {
background-color: lightblue;
}Agora se vamos usar um gradiente, por exemplo:
body {
background: linear-gradient(45deg, lightblue, blue);
}Ou então podemos usar background para colocar várias propriedades de uma vez só, como configurar uma imagem de fundo ao mesmo tempo que colocamos uma cor de fundo:
body {
background: white url("imagem-de-fundo.png") no-repeat right top;
}Esse código de uma linha só é o mesmo que todo esse código abaixo:
body {
/* Cor de fundo */
background-color: white;
/* Adicionando uma imagem de fundo e configurando sua posição */
background-image: url("imagem-de-fundo.png");
background-repeat: no-repeat;
background-position: right top;
}A propriedade background é mais usada quando queremos usar várias outras propriedades em uma única linha, além de também quando vamos usar efeitos. Espero ter ajudado!
Muito obrigado meu amigo! Show! Fico bem claro, agora entendi bem a diferença! Obrigado mesmo!