0

所以我在 Weebly 中选择了一个基本主题，并用我自己的 CSS 和 HTML 彻底改变了它。我正在尝试修改水平导航栏。栏本身是居中的，但栏内列出页面（主页、视频、设计、简历等）的文本不是。下面我包含了负责导航栏的 CSS。谢谢您的帮助！

#nav-wrap .container {
clear: both;
overflow: hidden;
position: relative;
}

#nav-wrap .container {
background:url(nav-bg-light.jpg) repeat-x top;
height:45px;
}

#nav-wrap .container ul {
list-style: none;
}

#nav-wrap .container ul li {
list-style: none;
float: left;
background:url(nav-saperator-light.jpg) no-repeat right;
padding-right:2px;
}

#nav-wrap .container ul > li:first-child a,
#nav-wrap .container ul > li:first-child a:hover,
#nav-wrap .container ul span:first-child li a,
#nav-wrap .container ul span:first-child li a:hover{
border-radius:5px 0px 0px 5px;
}

#nav-wrap .container ul li a {
float: left;
display: block;
font-family: 'Rosario', sans-serif;
color: #262626;
padding: 0px 30px;
border: 0;
outline: 0;
list-style-type: none;
font-size: 14px;
line-height:45px;
text-shadow: 0px -1px 0px #fff;
}

#nav-wrap .container ul li:hover {
background:url(nav-saperator-hover-light.jpg) no-repeat right;
}

#nav-wrap .container ul li a:hover {
background:url(nav-bg-hover-light.jpg) repeat-x top ;
}

#nav-wrap .container ul li:active {
background:url(nav-saperator-active-light.jpg) no-repeat right;
}

#nav-wrap .container ul li a:active {
background:url(nav-bg-active-light.jpg) repeat-x top ;
}

#nav-wrap .container ul li#active {
background:url(nav-saperator-current-light.jpg) no-repeat right;
}

#nav-wrap .container ul li#active a {
background:url(nav-bg-current-light.jpg) repeat-x top ;
}
4

2 回答 2

0

我想你只需要添加这个： 

#nav-wrap .container ul li a {
text-align:center;
}
于 2013-10-25T21:25:13.133 回答
0 
#nav-wrap .container ul li a { ... }

我认为这是您希望文本居中的位置，应该很容易做到

text-align:center;
于 2013-10-25T21:26:25.740 回答