La manera más sencilla de centrar una página web es usando CSS, y una serie de tags div. A continuación, se explicará como se hace esto, y se proporciona el código necesario para centrar una web.
Paso 1: Crear estructura
Primero crearemos el cuerpo principal de la página web:
<div id="todo"> <div id="contenido"><center>Este es el cuerpo de la página centrada</center></div> </div>
El contenedor todo será el principal, adentro de este estará el contenido de nuestra página Web.
Paso 2: Usar CSS para centrar el DIV
Agregaremos ahora el CSS, con el cual centraremos el contenedor contenido.
#todo{
position: absolute;
left: 50%; /* Comenzará a la mitad de la página */
margin-left: -450px; /* Es la mitad del ancho de todo el contenido */
}
#contenido{
background-color: yellow; /* amarillo para poder notar la diferencia */
width: 900px; /* ancho del contenido */
text-align: left;
}Lo que el CSS está haciendo es posicionando el contenedor todo a la mitad de nuestra pantalla (50%), pero luego debido al margen negativo, el cual es la mitad del ancho total de nuestra página web, se posicionará a la izquierda, mostrando que el contenedor contenido está centrado.
Por otro lado, te recomiendo que leas esta otra forma de centrar una página web que es un poco más simple y directa.
¿Este contenido te fue útil? Invítame un cafecito y ayúdame seguir creando más contenido. ¡Gracias! ♥︎
Invítame un cafecito
