¿Cómo puedo Centro un menú horizontal en CSS?

Centrado artículos horizontalmente en Cascading Style Sheets código (CSS) requiere dos cosas: una anchura total y los márgenes automáticos. Para su menú horizontal, con tal de que tiene un ancho ya configurado, puede agregar "margen: auto;" a su código para centrarla en la página. Esto funciona en todos los navegadores, aunque su éxito dependerá de lo bien que codificado el resto de su página Web. Centrado funcionará mejor en un menú programado en HTML como una lista "no ordenada" o al estilo de bala que usted o alguien más ya estilo como un menú usando CSS.

Instrucciones

1

Abra la página Web que contiene el menú horizontal en el Bloc de notas o un editor de código. Busque la hoja de estilos para su página web buscando en la cabeza del código para el "<link>" etiqueta apuntando a un archivo CSS. Si encuentra varios archivos CSS referenciados, abra la principal, normalmente llamado algo genérico como "default" o "estilo". Abra el archivo CSS referenciado por su página Web.

2

Busque el código para el menú horizontal en el código de la página Web. La mayoría de los menús usan el HTML para listas desordenadas para organizar enlaces:

<Ul id = "menu">

<Li> <a href="page1.html"> Page One </a> </ li>

</ Ul>

Tome nota del nombre de ID de la lista desordenada. En el ejemplo anterior, el nombre de identificación es "menú". Añadir un nombre de identificación si no encontró uno en el código.

3

Vaya a su archivo CSS que abrió y escribir un selector para "seleccionar" el menú por su ID en la parte inferior del archivo:

menú {} 4

Agregue el siguiente código entre las llaves de su selector CSS:

margen: auto;

Consejos y advertencias

  • Márgenes automáticos se basan en una anchura de sus cálculos. Su menú debe tener un valor de ancho situado en CSS, pero la mayoría ya tendrá este código.
  • Copia de seguridad de todos los archivos de las páginas web, incluyendo archivos CSS, al editar su sitio web.