Cómo centrar enlaces en HTML

Question

Soy realmente nuevo en HTML y me preguntaba cómo centrar enlaces múltiples con html?

He estado tratando:

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

pero el problema es cuando trato de poner otros enlaces detrás de él, por ejemplo:

<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> 

Sólo los coloca en líneas separadas. Creo que esto está sucediendo debido a la función <p> ... pero solo sé HTML, sé que puedes hacerlo en CSS, pero me preguntaba si se puede hacer usando solo HTML.

¡Gracias por cualquier ayuda!

Answer 1

hay algunos errores en su código - la primera: que usted havn't cerrado p -tag:

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

siguiente: p significa 'párrafo' y es un elemento de bloque (por lo que está causando un salto de línea). lo que quería utilizar hay una span, cosa que es sólo un elemento en línea, para el formato:

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

pero si sólo desea agregar un estilo a su enlace, ¿por qué no cambiar el estilo de que enlace directo:

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

al final, esto sería al menos html correcta, pero todavía no es exactamente lo que desea, porque text-align:center centra el texto en ese elemento, por lo que tendría que establecer que para el elemento que contiene este enlace (esta pieza f HTML no se ha publicado, por lo que no se puede corregir, pero espero que entienda) - para mostrar esto, voy a utilizar un simple div:

<div style="text-align:center">  
    <a href="http//www.google.com">Search</a> 
    <!-- more links here --> 
</div> 

EDIT: algunas más adiciones a su pregunta:

• p no es una 'función', pero tienes razón, esto está causando el problema (porque es un elemento de bloque)
• lo que estás tratando de utilizar es css - es solo en línea en lugar de colocarse en una sepera archivo de te, pero no están haciendo 'sólo HTML' aquí

Answer 2

le ponerlos dentro de un <p> o una muestra <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 3

El <p> mostrará en una nueva línea. Trate de envolver todos sus enlaces en un solo <p> etiqueta:

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

Answer 4

Puesto que usted tiene una lista de enlaces, usted debe estar marcándolos como una lista (y no como párrafos).

Listamatic tiene a bunch of examples of how you can style lists of links, incluyendo un número que son listas verticales con cada uno de los enlaces centrado (que es lo que parece que está buscando). También tiene a tutorial which explains the principles.

Esa parte del diseño se reduce esencialmente a "Establecer text-align: center en un elemento que se muestra como un bloque que contiene el texto del enlace" (que podría ser el propio anclaje (si lo haces visualizar como un bloque) o el elemento de la lista que lo contiene.

Answer 5

Trate de hacer un elemento nav con un elemento ul. El mío tiene un main anteriormente, pero no creo que lo necesite.

<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> 

El código es algo como esto.
Cuando alguna vez puse i n el código no funcionaría correctamente, por lo que debe completar el espacio en blanco,
y centrarlo.

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

Answer 6

Una solución es ponerlos dentro <center>, así:

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

También he creado un jsFiddle para usted: https://jsfiddle.net/9acgLf8e/