2013-10-16 139 views
0

我想对齐字体,以便它们出现在中心位置,而不会增加#nav li高于60px的最大高度。请建议一种方法。在这种情况下,最大高度不起作用。li> a元素中的CSS填充

HTML

<!DOCTYPE html> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
    <title></title> 
    <link href="StyleSheet.css" rel="stylesheet" type="text/css" /> 
</head> 
<body> 
    <div> 
     <ul id="nav"> 
      <li><a href="#">Work</a></li> 
      <li><a href="#">Blog</a></li> 
      <li><a href="#">About</a></li> 
      <li><a href="#">Contact</a></li> 
     </ul> 
    </div> 
</body> 
</html> 

CSS

#nav { 
list-style-type: none; 
margin: 0; 
padding: 0; 
} 
#nav li { 
width: 20%; 
float: right; 
text-align:center; 
} 
#nav li a { 
height:60px; 
display: block; 
padding: 0.5em 5px 0.5em 5px; 
text-decoration: none; 
font-weight: bold; 
color: #F2F2F2; 
} 
#nav a:link, #nav a:visited { 
background-color: #071726; 
} 
#nav a:hover, #nav a:active, #nav a:focus { 
background-color: #326773; 
} 

回答

3

添加line-height:60px#nav li a

这里是fiddle