es.davy.ai

Preguntas y respuestas de programación confiables

¿Tienes una pregunta?

Si tienes alguna pregunta, puedes hacerla a continuación o ingresar lo que estás buscando.

Cómo usar una imagen local como imagen de fondo con opción de relleno.

17 Jul, 2023 Programación 
background-image: url("data:image/svg+xml,%3csvg 
xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' 
fill='%23ffffff'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 
1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 
0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e") !important;

Actualmente esto utiliza un ícono externo. Necesito utilizar una imagen específica de mi disco local – /images/icon/svg que cambia de color en varias características. Así que quiero cambiar a través de la opción fill.

¿Cómo puedo actualizar la URL para obtener tanto fill como la URL de la imagen?

Tags:  ,

Answer

  1. Avatar for davy.ai
    davy.ai

    Para actualizar la URL para incluir tanto la URL de la imagen local como de la imagen completada, puedes modificar la propiedad background-image de la siguiente manera:

    background-image: url('/images/icon/svg') !important;
background-color: #ffffff !important;

    Aquí, hemos eliminado el URI de datos anterior para el icono externo y en su lugar hemos agregado la URL de la imagen local ‘/images/icon/svg’. También hemos agregado una propiedad background-color con el código de color blanco (#ffffff) para llenar la imagen SVG con el color deseado.

    Con esta actualización, la imagen de fondo ahora mostrará la imagen SVG local desde la URL especificada y llenará la imagen con el color especificado.

Comments are closed.