Atributo Style marginTop

Definición y uso

marginTop establecen o devuelven la márgen superior externa del elemento.

Atributo margin y Atributo padding Insertan espacio alrededor del elemento. Pero, la diferencia radica en que el margen inserta espacio alrededor del borde, mientras que el relleno inserta espacio dentro del borde del elemento.

Vea también:

Tutoriales de CSS:Margen externo de CSS

Manual de CSS:Atributo margin-top

Manual de HTML DOM:Atributo margin

Ejemplo

Ejemplo 1

Configurar la márgen superior externa del elemento <div>:

document.getElementById("myDiv").style.marginTop = "50px";

Pruebe usted mismo

Ejemplo 2

Volver a "normal" la márgen superior externa del elemento <div>:

document.getElementById("myDiv").style.marginTop = "0px";

Pruebe usted mismo

Ejemplo 3

Devolver la márgen superior externa del elemento <div>:

alert(document.getElementById("myDiv").style.marginTop);

Pruebe usted mismo

Ejemplo 4

Diferencia entre marginTop y paddingTop：

function changeMargin() {
  document.getElementById("myDiv").style.marginTop = "100px";
}
function changePadding() {
  document.getElementById("myDiv2").style.paddingTop = "100px";
}

Pruebe usted mismo

Sintaxis

Devolver la propiedad marginTop:

object.style.marginTop

Configurar la propiedad marginTop:

object.style.marginTop = "%|length|auto|initial|inherit"

Valor del atributo

Valor Descripción
% Defina el margen superior externo como un porcentaje del ancho del elemento padre.
length Defina el margen superior externo con una unidad de longitud.
auto Configuración de márgen superior del navegador
initial Establezca este atributo en su valor predeterminado. Consulte initial。
inherit Hereda este atributo del elemento padre. Consulte inherit。

Detalles técnicos

Valor predeterminado： 0
Valor devuelto： Cadena de caracteres, que representa la márgen superior externa del elemento.
Versión de CSS： CSS1

Navegador compatible

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
Soporte Soporte Soporte Soporte Soporte