:当应用于我的样式时,悬停不起作用:
<nav> <div class="container"> <div class="row-fluid center"> <div id="navcontainerimg" class="span12 center"> <img src="img/hs-header.png"/> </div> <div id="navcontainernav" class="span12 center"> <span class="topleft">Our Story</span> <span class="topright">Awesome Support!</span> <span class="bottomleft">Read the Blog!</span> <span class="bottomright">Join Now</span> </div> </div> </div>
可以在没有:hover的情况下设置类的样式,但添加时它不会执行任何操作.如果我点击Chrome中的:悬停样式显示,它会在那里显示,但不起作用.
解决方法
这是因为您为容器设置了负z-index,因此Chrome基本上无法识别悬停事件.
将其更改为:
#navcontainernav { width: 720px; margin-left: 40px; height: 170px; top: -233px; border-radius: 8px; position: relative; z-index: 1; }
或任何其他正面价值.