Mira Cómo Hacerlo

Cómo quitar o eliminar los márgenes del cuerpo de cualquier página o sitio web con CSS

Escrito por: Adrian Almiñana Navarro
28 enero 2021

El navegador web de hoy ha recorrido un largo camino desde los días locos donde cualquier tipo de coherencia entre navegadores fue una ilusión. Las páginas web se han convertido en una especie de manual en donde podemos encontrar diversos temas y tutoriales para las tareas diarias, de manera inmediata y sencilla. No todas los sitios web donde podemos encontrar estos artículos son totalmente automáticas, y puede que necesiten de algunas configuraciones manuales en su interfaz. Debido a esto, muchas veces necesitaremos saber cómo eliminar márgenes en sitios web.

Cómo Quitar o Eliminar los Márgenes del Cuerpo de Cualquier Página o Sitio Web con CSS

Los navegadores web de hoy cumplen con todos los estándares. Con ellos puedes organizar tu trabajo sea cuál sea de manera precisa y ordenada, permitiéndote ingresar en en grupos de trabajo o dominios de manera sencilla.

Además de que te permite almacenar en el computador distintos aspectos del entretenimiento diario, plataformas como Netflix que se pueden instalar en Windows fácilmente. Juegan un papel fundamental y ofrecen una visualización de página bastante consistente y fiel de los detalles en los distintos navegadores.

Esto incluye las últimas versiones de Google Chrome, Microsoft Edge, Mozilla Firefox, Opera, Safari y los diversos navegadores que se encuentran en la gran cantidad de dispositivos móviles que se utilizan para acceder al sitio web de hoy. De manera que si estás desarrollando un sitio web y necesitas borrar o eliminar los márgenes del mismo, hoy te enseñaremos cómo hacerlo.

quitar margenes cuerpo pagina

Índice()
  1. Cómo puedo eliminar márgenes en sitios web
  2. Cómo eliminar márgenes en sitios web fácilmente
    1. De esta manera, el código CSS quedaría de la siguiente forma
    2. En este punto el código quedaría de la siguiente forma

Cómo puedo eliminar márgenes en sitios web

Si bien se ha progresado en lo que respecta a los navegadores web y cómo muestran CSS en el desarrollo de la página web, todavía hay inconsistencias entre estas diversas opciones de software para personalizar tu página de la manera más ordenada y estética posible.

Una de las inconsistencias comunes es cómo esos navegadores calculan los márgenes de la página, el relleno de colores y formas y los bordes de los mismos de manera predeterminada. Debido a que estos aspectos del modelo de caja afectan a todos los elementos HTML que se encuentran en la página que intentas desarrollar y el porqué son esenciales de dominar para crear diseños de página que se adapten a la mayor cantidad de navegadores web posibles.

Una visualización inconsistente significa que una página puede verse bien en un navegador específico, pero un poco apagada o desordenada en otro. Se debe combatir este problema ya que no todos los usuarios utilizan un navegador en específico, ya que buscan el que mejor se adapte a sus necesidades. Muchos diseñadores web normalizan estos aspectos del modelo de caja. Esta práctica también se conoce como "poner a cero" los valores para márgenes, relleno y bordes.

Probablemente ya sabrá que un archivo HTML contiene una sección conocida como el "cuerpo". Encerrado por una etiqueta de apertura y cierre (<body> </body>).

El cuerpo debe contener todo el contenido que sea visible para el usuario. Si está viendo un borde blanco alrededor del borde de su sitio, es porque esta sección del cuerpo tiene un margen predeterminado alrededor de unos 10 píxeles.

quitar margenes sitio web

Cómo eliminar márgenes en sitios web fácilmente

Mediante las hojas de estilo CSS podemos modificar los márgenes de una página web. Esto hará que nuestro contenido se posicione en un lugar u otro de la página. Lo podremos pegar al borde superior, separarlo de la izquierda. Todo aquello que necesitemos para darle estilo a la página web. 18

Si queremos modificar los márgenes de una página web deberemos de utilizar cuatro propiedades CSS:

  1. margin-bottom, para el margen inferior.
  2. margin-left, para el margen izquierdo.
  3. margin-right, para el margen derecho.
  4. margin-top, para el margen superior.

Estas propiedades CSS se las podemos asignar a cualquier elemento HTML. Si bien, para nuestro caso se lo asignaremos al cuerpo de la página. Es decir, al elemento body.

De esta manera, el código CSS quedaría de la siguiente forma

body{
margin-left: 0px;
margin-right: 10px;
margin-top: 0px;
margin-bottom: 10px;
}

En el caso de que queramos asignar el mismo valor a todos los márgenes podemos utilizar directamente el atributo margin, asignándole un valor.

En este punto el código quedaría de la siguiente forma

body{
margin: 10px;
};

¿Has aprendido cómo eliminar márgenes en sitios web? Si te ha sido útil la información y tienes alguna duda un sugerencia, déjala en los comentarios. ¡Nos encantaría leerla!.

Subir