无法修复导航栏的悬停

时间:2017-02-04 12:33:02

标签: html css css3

我无法修复导航栏的悬停以完成我的Li元素上的孔广场,这是我的代码,所以你可以理解我,请帮忙。

我无法修复导航栏的悬停以完成我的Li元素上的孔广场,这是我的代码,所以你可以理解我,请帮忙。

https://jsfiddle.net/h41zhwrx/

<body>
    <!** Social Media Icons**>
    <div class='social-wrap'> 
<ul> 
<li><a class='facebook1' href='http://www.facebook.com/username' target='_blank' title='Facebook' rel='nofollow'></a></li> 
<li><a class='twitter1' href='http://twitter.com/username' target='_blank' title='Twitter' rel='nofollow'></a></li> 
<li><a class='google-p1' href='https://plus.google.com/b/username' target='_blank' title='Google Plus' rel='nofollow'></a></li> 
<li><a class='rss1' href='http://feeds.feedburner.com/username' target='_blaank' title='RSS Feed' rel='nofollow'></a></li> 
<li><a class='pinit1' href='http://www.pinterest.com/username' target='_blank' title='Pinterest' rel='nofollow'></a></li> 
<li><a class='linkdin1' href='http://www.linkedin.com/in/username' target='_blank' title='Linkedin' rel='nofollow'></a></li> 
</ul> 


</div>

  <!**my top bar space**>  

 <ul class="topnav" id="myTopnav">
  <li><a href="#home"></a>








     </li>

  <li class="icon">

  </li>
</ul>
    <div class="banner">
                  <img class="banner-image" src="img/banner.jpg" alt="Make Image responsive" >
                  </div>
     <!** My nav bar space**>
        <ul class="nav"> 
    <li class="icon">
    <a href="javascript:void(0);" onclick="myFunction()">&#9776;</a>
  </li>
    <li><a href="#"> DIGITAL      </a></li>
    <li><a href="#"> ANALYSES     </a></li>
    <li><a href="#"> CRÉATIVITÉ   </a></li>
    <li><a href="#"> TECHNOLOGIE  </a></li>
    <li><a href="#"> ÉVÉNEMENT    </a></li>   
    <li><a href="#"> EMPLOI       </a></li>
    <li><a href="#"> CONTACT      </a></li>        

        </ul>

    <div class="footer">Dzair Tic Tous droits réservés ©2017.</div>


    </body>

1 个答案:

答案 0 :(得分:0)

.nav {

    font-family: 'arial', serif;
margin-top: 0;
background-color: #1f5d86;
Color: #ffffff;
list-style: none; /* Na7i boutton ta3 la liste */
text-align: center;

    opacity: 0.9;
}

.nav > li {

display: inline-block;
padding: 15px 20px;
    font-size: auto ;

    }

只需在css中替换这两个类