2013-10-25 113 views
0

因此,我在Weebly中選擇了一個基本主題,並且已經使用我自己的CSS和HTML完全更改了它。我正在嘗試修改一個水平導航欄。酒吧本身是居中的,但是列出酒吧內的文字(家庭,視頻,設計,簡歷等)卻不是。下面我已經包含了負責導航欄的CSS。感謝您的幫助!Weebly導航欄中的中心內容

#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 ; 
} 

回答

0

我想你只需要補充一點:

#nav-wrap .container ul li a { 
text-align:center; 
} 
0
#nav-wrap .container ul li a { ... } 

我認爲這是要居中的文本,它應該很容易與

text-align:center;