freeCodeCamp/guide/portuguese/css/background-opacity/index.md

title	localeTitle
Background Opacity	Opacidade de fundo

Opacidade de fundo

A propriedade opacidade especifica a opacidade / transparência de um elemento, ou seja, o grau em que o conteúdo por trás do elemento é visível.

A propriedade de opacidade pode levar um valor de 0,0 a 1,0. Quanto menor o valor, mais transparente:

Encontre mais detalhes aqui

Você pode escolher até que ponto deseja tornar o elemento transparente. Você precisa adicionar a seguinte propriedade CSS para obter os níveis de transparência.

Totalmente opaco

.class-name { 
  opacity:1; 
 } 
 
 OR 
 
 .class-name { 
  opacity:1.0; 
 } 

Translúcido

.class-name { 
  opacity:0.5; 
 } 
 Opacity value can be anything between 0 and 1; 

Transparente

.class-name { 
  opacity:0; 
 } 
 
 OR 
 
 .class-name { 
  opacity:0.0; 
 } 

Alternativamente, você pode usar um valor rgba transparente como este: `` `css

.nome da classe{ cor de fundo: rgba (0,0,0, 0,5); } `` ` O exemplo acima define o plano de fundo como preto com 50% de opacidade. O último valor de um valor rgba é o valor alfa. Um valor alfa de 1 é igual a 100% e 0,5 (0,5 para curto) é de 50%. Usamos esse método para adicionar transparência a um elemento sem afetar o conteúdo interno.

Um exemplo codepen para mostrar intervalos de opacidade em segundo plano

Mais Informações:

Para mais informações, visite MDN Propriedade CSS de Opacidade no CSS-Tricks

Suporte do navegador: caniuse