0

Estoy agregando una marca de agua en el reporte que genera el modulo de odoo que estoy ocupando pero le mensaje que agrego lo pone delante de las letras del reporte y no quiero que se vea asi

Adjunto codigo:

<div 
    class="watermark" 
    style="position:absolute;opacity:0.1;font-size:100px;height:100%;text-align:center-index:1000;right:350px;border:0;padding-top:20px;"
>
    <span style="max-width:150px;color:#DEDCDC;">Copia</span>
</div>

ese es el código que ocupe parta poder agregar la marca de agua pero la muestra delante de la información del reporte no se si se deba a la etiqueta que puse para el mensaje de copia

adjunto imagen:

introducir la descripción de la imagen aquí

que tendría que hacer en los estilos para que se vea atras de la información y no pareciera que la esta tapando

4
  • Si estás poniendo un texto con css por delante de una imagen... no hay nada que puedas hacer. Siempre lo estás poniendo por delante. Lo que puedes hacer es bajarle la opacidad para que al menos sea transparente
    – Benito-B
    Commented el 11 nov. 2022 a las 15:31
  • de echo la opacidad de tiene de 0.1 y es muy visible Commented el 11 nov. 2022 a las 15:33
  • ¿Probaste asignando el color con rgba()?
    – KBeDev
    Commented el 11 nov. 2022 a las 15:37
  • no seria asi rgba(#colorqueseagregue)? seria asi? Commented el 11 nov. 2022 a las 15:40

1 respuesta 1

0

Podrías aplicarle transparencia a tu texto aplicando la función rgba():

<div style="background-color: black;">
    <span style="max-width:150px;color:#DEDCDC;">Copia</span><br>
    <span style="max-width:150px;color:rgba(255, 255, 255, 0.25);">Copia</span><br>
</div>

O también podrías hacerlo agregándole 2 dígitos más en el HEX del color, de la cual también le aplica transparencia:

<div style="background-color: black;">
    <span style="max-width:150px;color:#DEDCDC;">Copia</span><br>
    <span style="max-width:150px;color:#DEDCDC40;">Copia</span><br>
</div>

8
  • intente las respuestas que pusiste y ninguna funciono gracias de todas formas Commented el 11 nov. 2022 a las 16:07
  • De seguro alguno de los estilos del div de arriba está afectándolo. Quita el opacity de paso. Commented el 11 nov. 2022 a las 16:09
  • pues arriba de ese div tengo un div class row y arriba de ese tengo un div con estilos y solo es un magin y un padding Commented el 11 nov. 2022 a las 16:23
  • De seguro otro estilo o clase no le permite. Al final de cada propiedad color agrégale la declaración !important, quedando así: color:#DEDCDC40 !important; Commented el 11 nov. 2022 a las 16:28
  • ok lo intentare asi Commented el 11 nov. 2022 a las 16:30

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.