将链接放在html中的一行

新手上路,请多包涵

我有以下代码,链接出现在不同的行上。我如何将它们放在网页上的一行上-

 <p><a href="new.php">Add a new record</a></p>
<p><a href="view.php">View, Edit or Delete Existing Records</a></p>
<p><a href="index.html">Go to Home Page</a></p>

原文由 Aditya Dev 发布,翻译遵循 CC BY-SA 4.0 许可协议

阅读 421
2 个回答

如果您无法更改 html,一种方法是将 display: inline 添加到您的 <p> 标签中。

 p {
  display: inline;
}
 <p><a href="new.php">Add a new record</a></p>
<p><a href="view.php">View, Edit or Delete Existing Records</a></p>
<p><a href="index.html">Go to Home Page</a></p>

或者,如果您需要执行指定高度或宽度之类的操作, display: inline-block 就是答案。

 p {
  display: inline-block;
  height: 50px;
  background: grey;
}
 <p><a href="new.php">Add a new record</a></p>
<p><a href="view.php">View, Edit or Delete Existing Records</a></p>
<p><a href="index.html">Go to Home Page</a></p>

但是,如果您希望它们内联,我不会将每个链接都放在它自己的段落中,因为这不是好的做法。去掉 <p> 标签,如下:

 <a href="new.php">Add a new record</a>
<a href="view.php">View, Edit or Delete Existing Records</a>
<a href="index.html">Go to Home Page</a>

原文由 CalvT 发布,翻译遵循 CC BY-SA 3.0 许可协议

尽管可以按照您使用 p 标记的方式进行操作,但我建议使用 ul 然后 li

 li
{
  display:inline-block;
}
 <ul>
  <li><a href="new.php">Add a new record</a></li>
  <li><a href="view.php">View, Edit or Delete Existing Records</a></li>
  <li><a href="index.html">Go to Home Page</a></li>
</ul>

原文由 wegelagerer 发布,翻译遵循 CC BY-SA 3.0 许可协议

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题
logo
Stack Overflow 翻译
子站问答
访问
宣传栏