麻烦老师检查~
来源:2-2 编程练习
duqinaerfa
2019-08-15 19:15:07
也想问下我本来试图用子选择器,结果发现没有出现效果,甚至sublime里那个>符号也没有像视频里一样显示红色,是什么原因呢
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>IMOOC</title> <style type="text/css"> *{ margin: 0; padding: 0; } a{ text-decoration: none; } header{ height: 80px; background: black; width: 1200px; margin: 0 auto; } header .container a{ display: block; float: left; color: white; height: 60px; margin-left: 200px; margin-top: 20px; } header .container span{ font-size: 20px; color: white; margin-top: 50px; } header nav{ float: right; margin-right: 200px; } header nav a{ color: white; display: block; font-size: 18px; float: left; width: 70px; height: 73px; line-height: 80px; text-align: center; } header nav a.Home{ background: red; } header nav a.Course{ background: yellow; } header nav a.Actual{ background: green; } header nav a.Plan{ background: purple; } header nav a.FAQ{ background: orange; } header nav a.Notes{ background: blue; } header nav a:hover, header nav a.active{ padding-bottom: 7px; } </style> </head> <body> <!-- 在此完成网页的HTML代码--> <header> <div class="container"> <a href="#"> <img src="http://climg.mukewang.com/582e5f160001b17100400040.png"> <span>MYMOOC</span> </a> </div> <nav> <a href="#" class="Home active">Home</a> <a href="#" class="Course">Course</a> <a href="#" class="Actual">Actual</a> <a href="#" class="Plan">Plan</a> <a href="#" class="FAQ">FAQ</a> <a href="#" class="Notes">Notes</a> </nav> </header> </body> </html>
1回答
你好同学,建议导航宽度设置100%显示更好
如下设置:
另外,请同学描述一下具体哪里想要使用子选择器,具体是怎么设置不生效的。建议上传一下代码,以便老师针对代码为你讲解。
祝学习愉快!