Salve, vorrei impostare un'immagine di sfondo a un Div. Il codice è il seguente:
background-image:url(image)
Mi domandavo se era possibile impostare l'opacità dell'immagine impostata come sfondo. Ho fatto qualche ricerca, invano.
Grazie in anticipo a chi mi darà un suggerimento.
Ciao, attualmente le specifiche CSS non forniscono la possibilità di applicare l'opacità in modo esclusivo per background-image. La proprietà opacity agisce infatti sull'intero elemento.
Si può comunque risolvere in vari modi.
Potresti usare un'immagine png a cui applichi preventivamente la trasparenza desiderata, quindi usare questa come background-image.
In lternativa, per gestire l'opacità attraverso il CSS, in genere si usa un elemento posizionato opportunamente in modo assoluto, ad esempio un elemento <img> oppure uno pseudo-elemento definito per quello stesso <div>, quindi si applica l'opacità su tale elemento.
Qui qualche tutorial:
How to change background image opacity using CSS - sebhastian.com
How to change background-image opacity in CSS without affecting text - coder-coder.com
CSS Background Image Opacity Without Affecting the Text - linuxhint.com
Installa Forum HTML.it Toolset per una fruizione ottimale del Forum
Grazie della risposta. Temevo non si potesse applicare. L'alternativa, come ben dici, è di applicare preventivamente l'opacità all'immagine, anche se speravo si potesse fare. Purtroppo, la applica all'intero Div.
Grazie ugualmente, almeno so che non sbagliavo.
Non è che no si possa fare ma, se vuoi risolvere via CSS, devi applicare l'opacità ad un elemento o, meglio ancora, ad uno pseudo- elemento. Ad ogni modo è più semplice di quanto pensi. Dai uno sguardo a quei link e vedi come viene risolto.
Installa Forum HTML.it Toolset per una fruizione ottimale del Forum
Permessi di invio
Rispondi quotando