问题描述
- 新手问一下问什么二级导航没有背景,且没对齐
-
<<!DOCTYPE html><html><meta charset=""UTF-8""><head> <title>530</title><link rel=""stylesheet"" type=""text/css"" href=""html.css""></head><body><div id=""school""></div><div class=""nav""> <ul> <li><a href="""">我的大学</a></li> <ul> <li><a href="""">学校概况</a></li> <li><a href="""">校园风光</a></li> <li><a href="""">BT DOWN</a></li> </ul> </ul></div></body></html>*{ font-family: 楷体;}body{ font-color:rgb(353535);}ul{ list-style:none;} a{ text-decoration: none;}#school{ width:669px; height:104px; background-image:url(""../个人HTML/校徽.png""); background-repeat: no-repeat; margin:auto;}.nav{ width: 100%; height:40px; background-color:rgb(224223228); }.nav ul{ width: 100px; margin: auto ; text-decoration: none;}.nav ul li{ margin-left: 10px; float: left; text-decoration: none;}.nav ul li a{ width: 100px; height:30px; padding-top: 10px; color: white; margin:0px 10px; font-size: 15px; display: block; text-align: center; text-decoration: none;}.nav ul li a:hover { background-color: rgb(104140140);}/*1*/.nav ul li ul{ display: none;}.nav ul li:hover ul{ display: none; width: 100px; background-color: rgb(224223228); position: relative;}.nav ul li:hover ul li { display: none; width: 100px; height: 20px; font-size:12px; text-align: center; background-color: rgb(224223228);}.nav ul li:hover ul li a:hover{ border-color: rgb(104140140);}
解决方案
结构都错了吧,ul怎么嵌入ul中了。。
.nav ul li ul{ displaxy: none; margin-left:10px; padding:0; width: 100px; background-color: rgb(224223228); position: relative;}.nav ul li:hover ul{display:block}.nav ul li ul li { float:none; font-size:12px; width:auto; text-align: center; margin:0; background-color: rgb(224223228);}.nav ul li:hover ul li a:hover{ border-color: rgb(104140140);width:auto;display:block;margin:0px;}
<ul> <li><a href="""">我的大学</a> <ul> <li><a href="""">学校概况</a></li> <li><a href="""">校园风光</a></li> <li><a href="""">BT DOWN</a></li> </ul></li> </ul>
时间: 2024-09-14 07:45:49