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/top/index.html | 138 ++++++++++++++++++++++++++++++++++++++++ 1 file changed, 138 insertions(+) create mode 100644 files/es/web/css/top/index.html (limited to 'files/es/web/css/top') diff --git a/files/es/web/css/top/index.html b/files/es/web/css/top/index.html new file mode 100644 index 0000000000..7e5e36ef80 --- /dev/null +++ b/files/es/web/css/top/index.html @@ -0,0 +1,138 @@ +--- +title: Top +slug: Web/CSS/top +tags: + - CSS + - CSS Reference + - Referencia_CSS + - Todas_las_Categorías + - para_revisar + - páginas_a_traducir +translation_of: Web/CSS/top +--- +

{{ CSSRef() }}

+ +

Sumario

+ +

La propiedad top especifica parte de la posición de un elemento posicionado. No tiene efecto en elementos no posicionados.

+ +

Para los elementos con una posición absoluta (aquellos que tienen la propiedad {{ Cssxref("position") }}: absolute o {{ Cssxref("position") }}: fixed), determina la distancia entre el borde superior del elemento y el borde superior del bloque que lo contiene.

+ +

Para los elementos con una posición relativa (aquellos que tienen la propiedad {{ Cssxref("position") }}: relative), determina el desplazamiento hacia abajo que tendrá el elemento con respecto a su posición normal.

+ +

Cuando se define tanto la propiedad top como {{cssxref("bottom")}} para un elemento, y  {{cssxref("height")}} no se ha definido, tiene un valor auto o 100%, tanto la distancia top como {{cssxref("bottom")}} se respetan. Si {{cssxref("height")}} está definida, la aplicación de la propiedad top tiene precedencia y {{cssxref("bottom")}} será ignorada.

+ + + +

Sintaxis

+ +
   top: <longitud> | <porcentaje> | auto | inherit
+
+ +

Ejemplos

+ +
 /* se puede también usar unidades px para posicionar body para luego operar con el div */
+ body{
+   width: 100%;
+   height: 100%;
+ }
+ /* ahora podemos operar con unidades de porcentajes (con al 100% respecto de body) */
+ div{
+   position:absolute;
+   left:15%;
+   top:30%;
+   bottom:30%;
+   width:70%;
+   height:40%;
+   text-align:left;
+   border: 3px rgb(0,0,0) solid;
+ }
+
+ +
 <?xml version="1.0" encoding="utf-8"?>
+ <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+           "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+ <html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
+   <head>
+     <meta http-equiv="Content-Type" content="application/xhtml+xml" />
+     <title>Mozzila.org height top left width porcentaje CSS</title>
+     <style type="text/css">
+       /* se puede también usar unidades px para posicionar body para luego operar con el div */
+       body{
+         width: 100%;
+         height: 100%;
+       }
+       /* ahora podemos operar con unidades de porcentajes (con respecto al 100% del body) */
+       div{
+         position:absolute;
+         left:15%;
+         top:30%;
+         bottom:30%;
+         width:70%;
+         height:40%;
+         text-align:left;
+         border: 3px rgb(0,0,0) solid;
+       }
+     </style>
+   </head>
+   <body>
+      <center>
+        <div>
+             ...Contenido...
+        </div>
+      </center>
+
+   </body>
+ </html>
+
+ +

+ +

Especificaciones

+ + + +

Compatibilidad entre navegadores

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NavegadorVersión mínima
Internet Explorer?
Firefox1
Netscape?
Opera?
Safari?
+ +

Ver también

+ +

{{ Cssxref("position") }}, {{ Cssxref("right") }}, {{ Cssxref("bottom") }}, {{ Cssxref("left") }}

-- cgit v1.2.3-54-g00ecf