transparent background image

Question

I have the following css.

   #mypass{
                background-image: url(\"Images/logo.png\");
                background-attachment: fixed;
                      


        

Answer 1

The element that needs to have semi-transparent background:

#myPass

This is how without touching the HTML, we add controllable transparency background to the element:

#myPass::before {
    content: "";
    position: absolute;
    top: 0; right: 0;
    bottom: 0: left: 0;
    background: url(image.jpg) no-repeat top center;
    opacity: 0.5;
}

The only thing to note is that the #myPass element, must be positioned:

#myPass {
    position: relative; /* absolute is good too */
}