这是我的代码:Codepen
.sidebar{
width: 100%;
position: static;
display: block;
padding: 50px;
margin: 0px;
height: 562px;
border: none;
border-top: 1px solid black;
margin-bottom: 5%;
}
设置媒体查询以在700px以下更改页面样式。我希望所有的:悬停样式在顶部导航中消失,但我不能让它们消失。
另外,我遇到了.sidebar元素和底部重叠的固定页脚的问题。我在身体底部添加了边距,并没有修复它。
有什么建议吗?
答案 0 :(得分:0)
只需将:hover规则放入这样的查询中: http://codepen.io/anon/pen/pjNRam
@media (min-width: 700px){
nav ul li:hover{
background: #e92121;
color: #fff;
padding: 10px;
font-size: 22px;
}
}
答案 1 :(得分:0)
您需要做的就是添加:
nav ul li:hover
在媒体查询中。 选择器有点过于具体,您应该避免它,否则您将在项目后期的覆盖内容中遇到问题。同样尝试使用课程。