正在回答
你好,这里是由于鼠标移入的时候,添加了一个边框,宽高都发生了改变,所以建议:可以给原有的(就是没有hover的)也添加一个边框,颜色可与背景颜色相同,不过这里因为你设置的宽高超出了背景颜色,所以可以设置为透明,或者把边框调整下。例:

祝学习愉快~
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>jquery大作业</title>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<div class="main">
<!-- 顶部 -->
<div class="header">
<!-- 登录信息 -->
<div class="loginMsg">
<a href=""><span id="login">亲,请登录</span></a>
<a href=""><span id="rege">免费注册</span></a>
<a href=""><span>手机逛慕淘</span></a>
</div>
<!-- 导航条 -->
<div class="nav">
<div class="nav-li lis">
<span>我的慕淘</span><img src="素材/icon/21.png">
<ul>
<li>已买到的宝贝</li>
<li>我的足迹</li>
</ul>
</div>
<div class="nav-li lis">
<span>收藏夹</span><img src="素材/icon/21.png">
<ul>
<li>收藏的宝贝</li>
<li>收藏的店铺</li>
</ul>
</div>
<div class="nav-li">
<span>商品分类</span>
</div>
<div class="nav-li lis">
<span>卖家中心</span><img src="素材/icon/21.png">
<ul>
<li>免费开店</li>
<li>已卖出的宝贝</li>
<li>出售中的宝贝</li>
<li>卖家服务市场</li>
<li>卖家培训中心</li>
<li>体验中心</li>
</ul>
</div>
<div class="nav-li lis">
<span>联系客服</span><img src="素材/icon/21.png">
<ul>
<li>消费者客服</li>
<li>卖家客服</li>
</ul>
</div>
</div>
</div>
<div class="logo"></div>
<div class="nav"></div>
<div class="banner"></div>
<div class="floor"></div>
<div class="link"></div>
<div class="footer"></div>
</div>
</body>
</html>
/*全局*/
*{
margin: 0;
padding: 0;
}
a:link,a:visited{
text-decoration: none;
color: #000;
}
ul{
list-style: none;
}
.main{
width: 1200px;
height: auto;
margin: 0 auto;
}
/*顶部*/
.header{
width: 1200px;
height: 30px;
line-height: 32px;
font-size: 12px;
border-bottom: 1px solid #cecfd3;
background: #f3f5f7;
}
.loginMsg{
float: left;
margin-left: 20px;
}
.header span{
margin-right: 5px;
}
.header span:hover{
color: red;
cursor: pointer;
}
.nav{
float: right;
margin-right: 20px;
}
.nav-li{
float: left;
padding:0 10px;
}
.header img{
vertical-align: text-bottom;
}
.header ul{
display: none;
line-height: 2.5em;
}
.lis:hover ul{
display: block;
}
.lis:hover{
border: 1px solid #ddd;
background: #fff;
cursor: pointer;
}
.header li:hover{
color: #cdd0d4;
}
- 参与学习 人
- 提交作业 11218 份
- 解答问题 36712 个
从一个不会编程的小白到一个老司机是需要过程的,首先得入门,学习基础知识,然后才能进阶,最后再到精通,本专题是你走进前端世界的不二选择!
了解课程



恭喜解决一个难题,获得1积分~
来为老师/同学的回答评分吧
0 星