导航栏无法正常工作?
Nav bar isn't working properly?
所以我正在为学校评估制作一个网站,我想知道为什么我的导航栏链接总是略低于实际导航栏本身。如果有人能提供帮助那就太好了:)。
ul {
text-align: center;
padding-left: 1px;
top: -10px;
list-style: none;
}
ul li {
font-family: Arial;
font-size: 15px;
font-weight: bold;
display: inline-block;
margin-right: -4px;
position: 0px;
padding: 10px 89.5px;
background-color: #6C2DC7;
-webkit-transition: all 0.2s;
-moz-transition: all 0.2s;
transition: all 0.2s;
}
ul li:hover {
background: #8467D7;
}
a:link {color:#FFFFFF;} /* unvisited link */
a:visited {color:#FFFFFF;} /* visited link */
a:hover {color:#FFFFFF;} /* mouse over link */
a:active {color:#FFFFFF;} /* selected link */
a {
text-decoration: none;
}
如果您更改它,它将起作用:
您的 style.css
的第 75 行
ul {
text-align: center;
top: 0px;
list-style: none;
margin-top: -5px;
}
真的,你应该只为你的导航栏而不是每个 ul 做这个,所以你可以将其更改为以下内容:由你决定,尽管这两种方式都有效:)
#navigation ul {
text-align: center;
top: 0px;
list-style: none;
margin-top: -5px;
}
所以我正在为学校评估制作一个网站,我想知道为什么我的导航栏链接总是略低于实际导航栏本身。如果有人能提供帮助那就太好了:)。
ul {
text-align: center;
padding-left: 1px;
top: -10px;
list-style: none;
}
ul li {
font-family: Arial;
font-size: 15px;
font-weight: bold;
display: inline-block;
margin-right: -4px;
position: 0px;
padding: 10px 89.5px;
background-color: #6C2DC7;
-webkit-transition: all 0.2s;
-moz-transition: all 0.2s;
transition: all 0.2s;
}
ul li:hover {
background: #8467D7;
}
a:link {color:#FFFFFF;} /* unvisited link */
a:visited {color:#FFFFFF;} /* visited link */
a:hover {color:#FFFFFF;} /* mouse over link */
a:active {color:#FFFFFF;} /* selected link */
a {
text-decoration: none;
}
如果您更改它,它将起作用:
您的 style.css
的第 75 行ul {
text-align: center;
top: 0px;
list-style: none;
margin-top: -5px;
}
真的,你应该只为你的导航栏而不是每个 ul 做这个,所以你可以将其更改为以下内容:由你决定,尽管这两种方式都有效:)
#navigation ul {
text-align: center;
top: 0px;
list-style: none;
margin-top: -5px;
}