Estoy tratando de hacer que un cuadro de alerta sea ligeramente transparente, sin afectar el texto dentro del cuadro, pero no tengo idea de cómo debo implementarlo.

Mi archivo CSS se ve así

 .cookiealert 
{
    display:inline-block;
    width: 70%;
    height:8%; 
    margin: auto;
    text-align: center;
    padding: 5;
    opacity: 0.7;
  }
0
Nico1300 14 mar. 2021 a las 00:10

2 respuestas

La mejor respuesta

Los valores de color RGBA son una extensión de los valores de color RGB con un canal alfa, que especifica la opacidad de un color.

Un valor de color RGBA se especifica con: rgba (rojo, verde, azul, alfa). El parámetro alfa es un número entre 0.0 (completamente transparente) y 1.0 (completamente opaco).

.cookiealert 
{
    display:inline-block;
    width: 70%;
    height:8%; 
    margin: auto;
    text-align: center;
    padding: 5;
    background-color: rgba(255, 0, 0, 0.3);/* red with opacity */
  }
0
bl0cklevel 13 mar. 2021 a las 21:25

De hecho, encontré una respuesta yo mismo

.cookiealert {
    display:inline-block;
    width: 70%;
    height:8%; 
    margin: auto;
    text-align: center;
    padding: 5;
    background-color: rgba(0, 0, 0, 0.055)
    /*opacity: 0.7;*/
  }
0
Nico1300 13 mar. 2021 a las 21:22