From 1109132f09d75da9a28b649c7677bb6ce07c40c0 Mon Sep 17 00:00:00 2001 From: Peter Bengtsson Date: Tue, 8 Dec 2020 14:41:45 -0500 Subject: initial commit --- files/es/web/css/bottom/index.html | 86 ++++++++++++++++++++++++++++++++++++++ 1 file changed, 86 insertions(+) create mode 100644 files/es/web/css/bottom/index.html (limited to 'files/es/web/css/bottom') diff --git a/files/es/web/css/bottom/index.html b/files/es/web/css/bottom/index.html new file mode 100644 index 0000000000..6d26cf7c97 --- /dev/null +++ b/files/es/web/css/bottom/index.html @@ -0,0 +1,86 @@ +--- +title: bottom +slug: Web/CSS/bottom +tags: + - CSS + - 'CSS:Referencias' + - Todas_las_Categorías +translation_of: Web/CSS/bottom +--- +

+

<< Volver +

+

Resumen

+

La propiedad bottom especifica parte de la posición de un elemento (posicionado - es decir, con una posición determinada por código). +

Para los elementos con una posición absoluta (aquellos que tienen la propiedad position: absolute o position: fixed), la propiedad bottom determina la distancia entre el borde inferior del elemento y el borde inferior de su bloque contenedor. +

Para los elementos con una posición relativa (los que tienen la propiedad position: relative), la propiedad bottom determina la distancia que el elemento se mueve hacia arriba desde su posición normal. Sin embargo, la propiedad {{ Cssxref("top") }} se antepone a la propiedad bottom, por lo que si top no es auto, el valor computado de bottom es el valor negativo del valor computado de top. +

+ +

Sintaxis

+
   bottom: <length> | <percentage> | auto | inherit
+
+

Valores

+
<length> 
Una longitud, usada como se describe en el resumen. Puede ser un valor negativo, cero o un valor positivo. +
<percentage> 
Un porcentaje de la altura del bloque contenedor, usado como se describe en el resumen. +
auto 
Para los elementos con posición absoluta, el elemento se posiciona en base a la propiedad {{ Cssxref("top") }} y por tanto se trata height: auto como una altura basada en el contenido del elemento. Para los elementos posicionados como relativos, especifica un desplazamiento desde su posición normal basada en la propiedad {{ Cssxref("top") }} o si, top es también auto, no se produce desplazamiento alguno. +
inherit 
Recoge el valor que tenga el elemento padre (que puede no ser el bloque contenedor). Este valor calculado es tratado como si fuera un valor <length>, <percentage> o auto. +
+

Ejemplos

+
element {
+    position: absolute;
+    bottom: 20px;
+    height: 200px;
+    border: 1px solid #000;
+}
+
+

El siguiente ejemplo permite contrastar entre position:absolute y position:fixed. Cuando el texto ocupa un espacio más alto que la porción visible de la página (la porción visible en la ventana del navegador) los bloques posicionados con position:absolute se desplazarán junto con la página, mientras que los bloques posicionados con position:fixed, no lo harán. +

+ +
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
+   "http://www.w3.org/TR/html4/strict.dtd">
+<html>
+<head>
+<meta http-equiv="content-type" content="text/html; charset=iso-8859-1">
+<title>Position at bottom, absolute or fixed</title>
+<style type="text/css">
+p {font-size:30px; line-height:3em;}
+div.pos {width:49%; text-align:center; border:2px solid #00f;}
+div#abs {position:absolute; bottom:0; left:0;}
+div#fix {position:fixed; bottom:0; right:0;}
+</style>
+</head>
+<body>
+  <p>Esto<br>es<br>un texto<br>alto,<br>alto,
+    <br>alto,<br>alto,<br>alto<br>de prueba.</p>
+  <div id="fix" class="pos"><p>Fixed</p></div>
+  <div id="abs" class="pos"><p>Absolute</p></div>
+</body>
+</html>
+

Notas

+

Para los elementos posicionados de forma absoluta cuyo bloque contenedor sea un elemento de tipo bloque, esta propiedad es un desplazamiento a partir del borde de relleno (padding) de dicho elemento. +

Para los elementos posicionados de forma absoluta, la propiedad bottom no tiene efectos visibles cuando los valores {{ Cssxref("top") }}, {{ Cssxref("height") }}, y {{ Cssxref("margin-top") }} no son auto (que es el valor por defecto para top y height). +

+

Especificaciones

+ +

Compatibilidad entre navegadores

+This is as far back as the documentaion goes. +
Navegador Versión mínima
Internet Explorer 5
Firefox 1
Netscape 6
Opera 6
+

Ver también

+

{{ Cssxref("position") }}, {{ Cssxref("top") }}, {{ Cssxref("right") }}, {{ Cssxref("left") }} +


+

+
+

Categorías +

Interwiki Languages +

+
+{{ languages( { "fr": "fr/CSS/bottom", "pl": "pl/CSS/bottom", "en": "en/CSS/bottom" } ) }} -- cgit v1.2.3-54-g00ecf