feed twitter facebook LinkedIn facebook

CSS » Margenes de una página web

marzo 10, 2007 por Víctor Cuervo 13 Comentarios Imprimir Imprimir

Mediante las hojas de estilo CSS podemos modificar los margenes de nuestra 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.

Si queremos modificar los margenes deberemos de utilizar cuatro propiedades CSS:

  • margin-bottom, para el margen inferior.
  • margin-left, para el margen izquierdo.
  • margin-right, para el margen derecho.
  • 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:

<style type="text/css">
body{
  margin-left: 0px;
  margin-right: 10px;
  margin-top: 0px;
  margin-bottom: 10px;
}
</style>

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

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

<style type="text/css">
body{
  margin: 10px;
}
</style>

Visualizar el ejemplo | Descargar el código

tags:

Artículos relacionados:

13 comentarios »

RSS feed para los comentarios de esta entrada. TrackBack URI

1 2
  1. eva
    junio 21, 2007 #

    ok!

  2. DARKK*Bass
    octubre 11, 2007 #

    muy útil información

  3. carolina
    abril 25, 2008 #

    ayudo de mucho gracias

  4. Joseph
    agosto 23, 2008 #

    Gracias se pasaron eh…

  5. Geral
    diciembre 29, 2008 #

    Hola este curso es genial

  6. PEPE
    febrero 27, 2009 #

    UCHHHHHHHHHHHHHH QUE CUSO TAN SUPER HIPER MEGA MALO

  7. Butifarra
    marzo 21, 2009 #

    Muy Buenoo n_n!

  8. jose
    julio 27, 2009 #

    hola buenos dias, pero eso sirve para eliminar el margen de los formularios tambien?

  9. lineadecodigo
    agosto 24, 2009 #

    @Geral, Butifarra,

    Gracias por los ánimos. Intentamos ir poco a poco incluyendo nuevos contenidos.

  10. Laura
    agosto 28, 2009 #

    la página se ve perfecta en monitores 14¨y 15 ¨pero en los mas grandes se modifica totalmente, que debo hacer?

1 2

Deja un comentario

XHTML: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

*