老师您好，请检查，，辛苦了！谢谢！！！
请问我我把鼠标放在第一个链接嵌套的有序列表处，第一个无序列表圆点点变色，是代码哪里有问题吗？第二个链接没有这种情况...
<!DOCTYPE html>
<html>
<head>
<title>5-4编程练习</title>
<meta charset="utf-8">
<style type="text/css">
.top,.footer{background-color: gray;}/*页头页脚背景颜色*/
.main{background-color: #D3D3D3;}/*主体背景颜色*/
span{color:blue;}
div ul li{color: green;}
a:link{color: green;}/*未访问链接颜色*/
.li:hover,
a:hover{color: blue;}/*鼠标滑过链接颜色*/
.classred{color: red;}
.classyellow{color:yellow;}
</style>
</head>
<body>
<!------------------------------------页头--------------------------------->
<div class="top" >慕课网</div>
<!------------------------------------主体--------------------------------->
<div class="main">
<div>
<p><span>HTML超文本标记语言，</span>“超文本”就是指页面内可以包含图片、链接，甚至音乐、程序等非文字元素。</p>
<p style="color: gray">课程内容</p>
<ul>
<li class="li"><a href="#">html基础标签</a>
<ol>
<li class="classred">段落标签</li>
<li class="classred">图像和超链接标签</li>
<li class="classred">列表标签</li>
</ol>
</li>
<li>html表格标签</li>
<li>html表单标签</li>
</ul>
</div>
<div>
<p>
<span>CSS层叠样式表</span>（Cascading Style Sheets），样式定义如何显示HTML元素。
</p>
<p style="color: gray">课程内容</p>
<ul>
<li class="li"><a href="#1">CSS基础语法</a></li>
<li>
CSS使用方法
<ol>
<li class="classred">行内样式</li>
<li class="classred">内部样式</li>
<li class="classred">外部样式</li>
</ol>
</li>
<li>
CSS选择器
<ul >
<li class="classyellow">ID选择器</li>
<li class="classyellow">class选择器</li>
<li class="classyellow">标签选择器</li>
</ul>
</li>
</ul>
</div>
</div>
<!------------------------------------页脚--------------------------------->
<div class="footer">慕课网 只学有用的</div>
</body>
</html>
正在回答
同学你好， 如下图所示，你的HTML结构中， 无序列表是作为.li的子元素， 在鼠标移入无序列表的时候，此时鼠标也相当于是在其父元素li上，所以会触发.li的hover事件， 出现你说的这种情况。
因为根据练习的要求， 需要使用li嵌套一个无序列表实现效果， 所以这种情况目前是没有解决的方法的。这里建议直接给a链接设置hover样式实现链接改变字体颜色的效果就可以了。
如果帮助到了你， 欢迎采纳！
祝学习愉快~~~
恭喜解决一个难题，获得1积分~
来为老师/同学的回答评分吧
0 星