testo su immagine di background filtrata

[ninja72]

Potresti utilizzare lo pseudo elemento ::before sulla classe banner in modo che l'effetto venga replicato solo sullo pseudo elemento e non su tutti i child del parent.
In questo caso potresti eliminare del tutto la classe .banner e inserire lo pseudo elemento in questo modo:

.banner::before {
            content: "";
            position: absolute;
            width: 100%;
            height: 400px;
            background-image: url(immagini/immagini/1.jpg);
            background-size: cover;
            background-repeat: no-repeat;
            filter: opacity(50%) blur(2px);
        }

Inoltre ti potrei consigliare di eliminare i prefissi visto che nel caso andrebbero a coprire solo un eventuale 1% di casistica scoperta da browser datati.

[merovese]

Potresti utilizzare lo pseudo elemento ::before sulla classe banner in modo che l'effetto venga replicato solo sullo pseudo elemento e non su tutti i child del parent.
In questo caso potresti eliminare del tutto la classe .banner e inserire lo pseudo elemento in questo modo:

.banner::before {
            content: "";
            position: absolute;
            width: 100%;
            height: 400px;
            background-image: url(immagini/immagini/1.jpg);
            background-size: cover;
            background-repeat: no-repeat;
            filter: opacity(50%) blur(2px);
        }

Inoltre ti potrei consigliare di eliminare i prefissi visto che nel caso andrebbero a coprire solo un eventuale 1% di casistica scoperta da browser datati.

ti ringrazio ma in questo modo tutti i contenuti si spostano sopra l'immagine, come se il div banner fosse diventato il background di tutto i sito, e non solo del testo che effettivamente deve esserci