Paga en 4 cuotas sin intereses de $52.25

Antes:$249

Currency
$209

Paga en 4 cuotas sin intereses

Paga en 4 cuotas sin intereses
Suscríbete

Termina en:

18d

21h

16m

27s

3

Tutorial de posicionamiento relative, absolute y fix con CSS.

Comenzaremos colocando la estructura inical del html, para llevarlo a cabo un contenedor y un elemento hijo, como se observa en la imagen. Seguido de esto tambien se coloca la etiqueta “style”, con el fin de estilizar la hoja de estilos.

1e6e849a-b868-4e91-ad22-25edfab85322.jpg

En esta imagen vemos el resultado del posicionamiento relativo.

715a1808-d72c-4a6c-9ac9-dc4763058d97.png

Ahora usaremos el posicionamiento absoluto movientolo hacia la derecha para mayor claridad.

54c01a58-96d2-4167-a075-b75ae6715124.jpg

En la siguiente imagen se ve mas claro. Este indica que su espacio en el cual se puede desplazar es sobre el elemento contenedormas mas cercano.

81976451-3312-4491-9423-f904521c9b85.png

Ahora usaremos posicionamiento Fixed la cual es utilizada atra vez de un nav.

13b11a0d-0cd6-4063-a894-0c8549ad5b94.png

El Fix lo usamos para colocar un objeto fijo en la pantalla como se observa en las imagenes.

1f56c9e0-03e1-4dd2-adce-eae04f973169.jpg

Como se observa en la siguiente imagen, ya esta en la parte superior y se puede ver con claridad el texto.

8dfd70e3-1681-4056-8351-a287839fe417.jpg

Y para finalizar organizamos la hoja de estilo con el fin de que no queden encima una cosa con la otra.

899aab36-1f21-45de-80a9-380b6d6ba2cb.png

Y asi queda el css.

2ae1fda9-3c22-477c-8cfc-d3a7064d0b43.jpg

En conclusion los posionamientos nos ayudan tambien dependiendo que necesitemos colocar primero y para mayor practicidad los estilo se realizan en una hoja aparte.

Escribe tu comentario
+ 2