Question

我是HTML新手，想知道如何使用html中心多个链接？

我一直在努力：

  <a href="http//www.google.com"><p style="text-align:center">Search</a>

但问题是当我尝试将其他链接放在后面时：

 <a href="http//www.google.com"><p style="text-align:center">Search</a><a href="Contact Us"><p style="text-align:center">Contact Us</a></p>

它只是将它们放在不同的行上。我相信这是因为<p>函数而发生的...但我只知道HTML，我知道你可以在CSS中完成它，但我想知道是否只使用HTML来完成。

感谢您的帮助！

Answer 1

你的代码中有一些错误 - 第一个：你没有关闭你p - 标签：

<a href="http//www.google.com"><p style="text-align:center">Search</p></a>

next：p代表'paragraph'并且是一个块元素（因此它会导致换行）。您想要使用的是span，它只是格式化的内联元素：

<a href="http//www.google.com"><span style="text-align:center">Search</span></a>

但如果您只是想为链接添加样式，为什么不直接为该链接设置样式：

<a href="http//www.google.com" style="text-align:center">Search</a>

最后，这至少是正确的html，但仍然不是你想要的，因为text-align:center将文本置于该元素的中心，所以你必须设置对于包含这个链接的元素（这个html没有发布，所以我无法纠正你，但我希望你能理解） - 为了表明这一点，我将使用一个简单的{ {1}}：

div

编辑：您问题的其他一些内容：

<div style="text-align:center"> <a href="http//www.google.com">Search</a>  </div>不是'功能'，但你是对的，这会导致问题（因为它是一个块元素）
你正在尝试使用 css - 它只是内联而不是放在一个单独的文件中，但你不是在这里'只做HTML'

Answer 2

由于您有一个链接列表，您应该将它们标记为列表（而不是段落）。

Listamatic有a bunch of examples of how you can style lists of links，其中包含一个垂直列表的数字，每个链接都居中（这就是您之后所看到的）。它还有a tutorial which explains the principles。

样式的那部分实质上归结为“在显示为包含链接文本的块的元素上设置text-align: center”（可能是锚本身（如果将其显示为块））或包含它的列表项。

Answer 3

您可以将它们放在<p>或<div>

中

<p style="text-align:center">
    <a href="http//www.google.com">Search</a> 
    <a href="Contact Us">Contact Us</a>
</p>

示例：http://jsfiddle.net/X8HM4/1/

Answer 4

＆lt; p＆gt;将出现在新的一行。尝试将所有链接包装在一个单独的＆lt; p＆gt;中标记：

<p style="text-align:center;"><a href="http//www.google.com">Search</a><a href="Contact Us">Contact Us</a></p>

Answer 5

p不是您在a中放置文本的方式。那就是问题所在。唯一的解决方案是将文本放在<a>和</a>之间。例如：

<a href="https://stackoverflow.com/posts/64201994/edit" style="text-align:center;">Stack Overflow</a>

Answer 6

一种解决方案是将它们放在<center>内，如下所示：

<center>
<a href="http//www.google.com">Search</a>
<a href="Contact Us">Contact Us</a>
</center>

我也为你创建了一个jsfiddle：https://jsfiddle.net/9acgLf8e/

Answer 7

嗯，一种非常简单的方法就是采用老式方法并通过使用来省去麻烦。您可以以任何您喜欢的方式更改 margin-left 或 margin-right 以及与像素的距离。

<a href:"#" style:"margin-left:"260px">Link</a>

Answer 8

尝试使用nav元素执行ul元素。我的上面有main，但我认为你不需要它。

<main>
<nav>
<ul><li><a href="http//www.google.com">search</a>
<li><a href="http//www.google.com">search</a>
<li><a href="http//www.google.com">search</a>

代码是这样的。
当我输入代码时它不会正常工作，所以你需要填写空白，
然后把它放在中心位置。

main
nav
ul> li> a>: href="link of choice":name of link:/a>

如何将链接置于HTML中心

8 个答案: