老师，为什么下划线，我的是整个item的呢？
css文件
----------------
.header{
background-color: #f7f7f7;
}
.header_wrap{
width:1200px;
height:80px;
position:relative;
margin:0 auto;
}
.header_logo{
width: 150px;
height:38px;
line-height:38px;
font-size:20px;
color:#07111b;
text-indent:50px;
background:url('../img/logo.png') left center no-repeat;
background-size:38px 38px;
position:absolute;
top:50%;
margin-top:-19px;
left:20px;
}
.header_nav{
height:38px;
position:absolute;
top:50%;
right:20px;
margin-top:-19px;
}
.header_nav-item{
font-size:14px;
color: #292f35;
display: block;
height:38px;
line-height:38px;
float:left;
width:30px;
text-align:center;
padding-left:40px;
}
.header_nav-item:hover{color:#f01400;}
.header_nav-item_status_active{
color: #f01400;
}
.header_nav-item_status_active:after{
content:'';
display:block;
height:2px;
width:100%;
background-color:#f01400 ;
position:absolute;
left:0;
bottom:0;
}
.header_nav-item_custom_button{background:#000;
color:#f4f4f5;
text-align:center;
border-radius:3px;
width:90px;
margin-left:40px;
padding:0;}
--------------
html文件
----------------------
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<link rel="stylesheet" href="../css/base.css" />
<link rel="stylesheet" href="../css/cssall1.css" />
<title>Document</title>
</head>
<body>
<header class="header">
<div class="header_wrap">
<div class="header_logo">慕课手机</div>
<nav class="header_nav">
<a src="javascript:;" class="header_nav-item header_nav-item_status_active">首页</a>
<a src="javascript:;" class="header_nav-item">外观</a>
<a src="javascript:;" class="header_nav-item">配置</a>
<a src="javascript:;" class="header_nav-item">型号</a>
<a src="javascript:;" class="header_nav-item">说明</a>
<a src="javascript:;" class="header_nav-item header_nav-item_custom_button">立即购买</a>
</nav>
</div>
</header>
</body>
</html>
恭喜解决一个难题，获得1积分~
来为老师/同学的回答评分吧
0 星