如何将多个链接放在同一行？ （HTML5）

Question

我试图将多个链接放在同一行，这样我就可以有一整栏链接，我已经尝试过：

<a href="website_homepage.htm"><h2 style="font-family:tempus sans itc;">Home</h2></a> <a     href="website_hills.htm"><h2 style="font-family:tempus sans itc;">Hills Pupil Tailored Website</h2></a>

但是当我测试它是否有效时，这两个链接位于单独的行上，有谁知道如何将它们放在同一行上？

Answer 1

只需添加：

h2{
    display: inline;
}

交给你的CSS，问题就解决了。

Answer 2

这是因为

h2

display

属性是

block

。

尝试：

h2 {
    display: inline-block;
}

或

h2 {
    display: inline;
}

在文件的开头（用

<style>

标签括起来）或样式表文件中。

Answer 3

或者将“h2”替换为“span”，链接将位于同一行。

或者你可以输入：

<h2 style="font-family:tempus sans itc;"><a href="website_homepage.htm">Home</a> <a href="website_hills.htm">Hills Pupil Tailored Website</a></h2>

将所有链接放在一个 h2 标签中，而不是每个链接使用一个标签。

Answer 4

如果您正在寻找的话，我找到了一种仅用 HTML 即可完成此操作的方法。如果您将代码重写为如下所示：

<a href="website_homepage.htm">Home</a>
<a href="website_hills.htm">Hills Pupil Tailored Website</a>

然后您的链接将并排显示。

完全透明，我刚刚开始我的开发者之旅。我目前正在学习全栈开发人员课程，并且只学习课程的 HTML 部分（我还没有接触到 css 或 javascript 部分）。所以可能有更好的方法使用 CSS 或其他我还没有学过的技巧来做到这一点。

我假设我最终会学习如何通过 CSS 对其进行格式化，但我想我会添加我所知道的内容，以防这就是您正在寻找的内容。