jeudi 18 octobre 2018

Background img with filterand nav - CSS

I have the next question: I have a div with background img, I added a filter brightness, but that also affected what I have next to that image: [![introducir la descripción de la imagen aquí][1]][1]

html:

<header>
   <div id="logo-page">
        <div id="top-bar">
            <nav>
                <a href="#" class="menu">home</a>
                <a href="#work" class="menu">work</a>
                <a href="#projects" class="menu">projects</a>
                <a href="#gallery" class="menu">gallery</a>
                <a href="#papers" class="menu">papers</a>
                <a href="#" class="menu">contact</a>
            </nav>
        </div>
    </div><!-- Logo -->
</header>

CSS:

#logo-page{
 background-color: rgba(0,0,0,1);
background-image: url("../img/logo.jpg");
width: auto;
height: 100vh;
background-repeat: no-repeat;
background-size: cover;
background-position: center center;
filter:brightness(0.5);  

}

the idea is that the nav or what you add inside of is not affected by the filter.




Aucun commentaire:

Enregistrer un commentaire