关于active和">"的问题

关于active和">"的问题

*{
	padding:0;
	margin:0;
	font-family:Arial;
	font-size:14px;
	border:none;
}
a{text-decoration:none;}
ul{list-style:none;}
header{
	height:80px;
	width:100%;
	background:#000;
}
header .container{
	width:1200px;
	margin:0 auto;
}
header .container a{
	display:block;
	float:left;
}
header .container nav{float:right;}
header .container nav a{
	display:block;
	float:left;
	color:white;
	font-size:24px;
	height:73px;/*低于父容器高,备用*/
	line-height:73px;/*行高等于自身高则上下居中*/
	width:110px;/*设置宽度,撑开左右*/
	text-align:center;	
}
nav  a:nth-child(1) { background: #433b90; }
nav  a:nth-child(2) { background: #017fcb; }
nav  a:nth-child(3) { background: #78b917; }
nav  a:nth-child(4) { background: #feb800; }
nav  a:nth-child(5) { background: #f27c01; }
nav  a:nth-child(6) { background: #d40112; }
nav a:hover{
	padding-bottom:7px;
}

html代码与老师一样不再重复,请问我不使用">"也可以实现同样的效果,为什么还要用">"?

其中不使用active只用hover也实现了同样的效果,请问active是什么意思,它在这里的用处是什么?

正在回答

登陆购买课程后可参与讨论,去登陆

1回答

同学你好,关于你的问题,回答如下:

1、“>”表示直接子元素,就是该元素下面的元素。比如:这里nav>a;就是nav的子元素a才有效。

而nav a就是nav下的a元素就有效,不管是子元素还是后代元素。

2、active是类名,这里是设置第一个元素(给第一个元素添加了这个类),默认的就有这个样式,不需要鼠标移入(hover的时候)触发。

如果我的回答帮助了你,欢迎采纳,祝学习愉快~

问题已解决,确定采纳
还有疑问,暂不采纳

恭喜解决一个难题,获得1积分~

来为老师/同学的回答评分吧

0 星
请稍等 ...
意见反馈 帮助中心 APP下载
官方微信

在线咨询

领取优惠

免费试听

领取大纲

扫描二维码,添加
你的专属老师