Cor de texto e cor de fundo em CSS

Cor de texto e cor de fundo em CSS
As folhas de estilo em cascata (CSS) são um idioma usado para estilizar páginas da web escritas em HTML e XML. Essas folhas de estilo consistem em uma enorme quantidade de propriedades que podem ser usadas para melhorar a aparência das páginas da web. Essas propriedades são úteis ao formatar elementos de uma página da web. Nesta redação, focaremos especificamente nas propriedades usadas para aplicar a cor e o fundo da cor em um texto em uma página da web.

Primeiro, examinaremos a propriedade de cores do CSS que pode ser usada para aplicar a cor do texto que aparece na página da web.

Cor do texto

Você pode aplicar a cor ao texto em uma página da web usando a propriedade colorida do CSS. Pode haver três abordagens para aplicar cores ao texto que são as seguintes.

1. Use o nome de cor

A maneira mais simples de aplicar a cor no texto é usando o nome da cor. O CSS suporta um total de 140 nomes de cores, como vermelho, amarelo, marrom, Skyblue, etc. Por exemplo,

H1
cor azul;

2. Use um código de cores hexadecimal

Esses códigos denotam intensidades de cor primária e são escritos usando três pares de caracteres. 00 representa a menor intensidade de uma cor primária e FF representa a maior intensidade de uma cor primária. Por exemplo, o código hexadecimal de vermelho é #ff0000, azul é #0000FF, Brown é #964B00, etc.

H1
Cor: #0000FF;

3. Use um valor RGB

RGB é um modelo de cores composto pelas três cores primárias vermelhas, verdes e azuis. A faixa de valor dessas cores é de 0 a 255. 0 representa a menor intensidade de uma cor primária e 255 representa a maior intensidade de uma cor primária. O valor RGB do azul é (0,0,255), o vermelho é (255,0,0), o amarelo é (255,255,0), etc.

H1
Cor: RGB (255,255,0);

Vamos ver um exemplo de aplicação de cor a diferentes elementos HTML.

Exemplo
No exemplo a seguir, demonstramos todas as abordagens mencionadas acima da aplicação de cores a diferentes elementos HTML usando a propriedade colorida do CSS.







Este cabeçalho é verde


Este cabeçalho é azul


Este parágrafo é vermelho



Saída

A cor de

o elemento está definido como verde usando a abordagem de código hexadecimal, cor de

o elemento é definido como azul usando a abordagem de nome de cor e a cor de

O elemento está definido como vermelho usando a abordagem de valor RGB.

Agora que temos um entendimento básico de aplicar a cor no texto, vamos tentar entender como aplicar a cor de fundo em elementos em uma página da web.

Cor de fundo
Você pode aplicar a cor de fundo aos elementos em uma página da web usando a propriedade cor de fundo do CSS. Isso pode ser feito usando as três abordagens mencionadas na seção acima. Vamos ver um exemplo.

Exemplo
No exemplo a seguir, demonstramos a propriedade de cores e a propriedade cor de fundo do CSS.







Este é um parágrafo





No exposto, usamos as três abordagens diferentes (nome de cor, código hexadecimal, valor RGB) para fornecer cor de texto e cor de fundo a três elementos diferentes (, e).

Saída

Usando a cor e a propriedade cor de fundo, todos os três elementos estão sendo estilizados.

Conclusão

Usando a cor e a propriedade cor de fundo do CSS, você pode aplicar cores e cores de fundo ao seu texto em um documento HTML. A cor pode ser especificada usando o nome da cor, o código hexadecimal da cor ou o valor RGB da cor. O intervalo de valor de um código Hex é 00 a FF, enquanto que o intervalo de valor de um valor RGB é de 0 a 255. Essas faixas representam as intensidades das cores primárias. Este artigo destaca as propriedades de cor e cor de fundo do CSS em profundidade com a ajuda de exemplos apropriados.