Question

我想请求帮助，因为我无法设置链接元素的高度（HOME，GAMES，ANIMALS，LOGOUT）。 HTML代码：

    echo"<div id=\"navigation_bar\">";
echo"<ul>";
echo" <li id=\"home\"><a href=\"animal_home.php\" >HOME</a></li>";
echo" <li id=\"laro\"><a href=\"animal_laro.php\">GAMES</a></li>";
echo" <li id=\"aralin\"><a href=\"animals.php\">ANIMALS</a></li>";
echo" <li id=\"logout\"><a href=\"animal_logout.php\">LOGOUT</a></li>";
echo"</ul>";
echo"</div>";

虽然这是css：

 #navigation_bar ul {
display:block;
float:left;
width:800px;
height:50px;
background:url(images/animal_home_nav.png) no-repeat center;
list-style:none;
}



#navigation_bar ul li  {
display:block;
float:left;
height:50px;
}

  #home{
width:190px;
}


#aralin {
width:220px;
}


#laro {
width:161px;
}

  #logout{
width:200px;    
}

Answer 1

只需在css文件中添加此css

即可

#navigation_bar ul li a{
display:block;
height:100%;
width:100%
}

Answer 2

如果你将它添加到你的CSS中，你应该能够在a标签上放置你想要的任何尺寸：

#navigation-bar ul li a {
    display:block;
    height:100%; /* or whatever height value you want to use */
}

您的问题是标记是内联元素，您只能在块元素上设置尺寸。因此，如果您将尺寸设置为li（即块元素）并设置要显示的标签：block;宽度：100％;和高度：100％;，它们将填满整个内部。

希望这有帮助！

HTML将链接元素的高度设置为其背景

2 个答案: