我花了一段时间试图找出如何使文本链接水平放置在导航栏上,但没有成功。我非常喜欢编码所以这可能非常容易,我使用的是html和CSS ,我试过把它们放在同一条线上。还使用:
#nav li a {
color: black;
display: inline;
list-style-type: none;
}
#nav li a {
color: black;
position: relative;
}
我试图在网站上找到答案,但我看不到一个,所以我想我也可以问问别人。谢谢你的阅读。
答案 0 :(得分:3)
您的目标是错误的元素,它应该是
#nav li {
display: inline;
}
您选择了a
元素,您需要定位li
,默认情况下a
是inline
元素,li
会在另一个元素下方呈现,为了使它们内联,我们定位li
我建议你使用
#nav li {
display: inline-block;
margin-left: -4px; /* If that white space matters to you */
}
因为你会得到同样的效果,但还有一些额外的奖励,比如margins padding
,可以让你的元素空白。或者,您也可以使用float: left;
,但您需要clear
您的花车,因此坚持使用inline-block