Ejemplo
Ajuste el borde superior de la absoluta posicionado <div> elemento de 80px por debajo del borde superior de su antepasado posicionado más próximo:
div.absolute {
position: absolute;
top: 80px;
width: 200px;
height:
100px;
border: 3px solid #8AC007;
}
Inténtalo tú mismo " Definición y Uso
Para los elementos con posición absoluta, la propiedad top establece el borde superior de un elemento a una unidad por encima / debajo del borde superior de su antepasado posicionado más próximo. Nota: Si un elemento con posición absoluta no tiene antepasados posicionado, que utiliza el cuerpo del documento, y se mueve junto con el desplazamiento de página. Nota: Un "positioned" elemento es uno cuya posición es nada más que estática.
Para los elementos en posición relativa, la propiedad superior fija el borde superior de un elemento a una unidad de arriba / debajo de su posición normal.
Note: Si "position:static" , la propiedad top no tiene ningún efecto.
| Valor por defecto: | auto |
|---|---|
| Heredado: | no |
| animatable: | yes. Read about animatable Try it |
| Versión: | CSS2 |
| la sintaxis de JavaScript: | object .style.top="100px" Try it |
Soporte para el navegador
Los números de la tabla especifican la primera versión del navegador que es totalmente compatible con la propiedad.
| Propiedad | |||||
|---|---|---|---|---|---|
| top | 1.0 | 5.0 | 1.0 | 1.0 | 6.0 |
sintaxis CSS
top: auto|length|initial|inherit;Valores de propiedad
| Valor | Descripción | Juegalo |
|---|---|---|
| auto | Permite que el navegador calcular la posición del borde superior. Esto es por defecto | Juegalo " |
| length | Establece la posición del borde superior en píxeles, cm, etc. Los valores negativos se les permite | Juegalo " |
| % | Establece la posición del borde superior en% de contener elemento. Los valores negativos se les permite | Juegalo " |
| initial | Establece esta propiedad a su valor por defecto. Lea acerca inicial | Juegalo " |
| inherit | Hereda esta propiedad de su elemento padre. Lee sobre heredar |
Páginas relacionadas
CSS tutorial: Posicionamiento CSS
Referencia CSS: bottom property
Referencia CSS: left property
Referencia CSS: right property
Referencia HTML DOM: top property