Saltar navegación

Posicionamento Normal

O posicionamento normal ou estático é o modelo que utilizan por defecto os navegadores para mostrar os elementos das páxinas.

Os elementos de bloque móstranse como se fosen caixas (tal e como vimos no modelo de caixas) unha debaixo doutra comezando dende o principio do elemento que o contén. A distancia entre as caixas contrólase mediante as marxes verticais.

Exemplo do comportamento do posicionamento normal

Exemplo do comportamento do posicionamento normal en CSS.

Nos elementos as caixas móstranse unha detrás doutra de forma horizontal comezando dende a posición máis á esquerda do seu elemento colector. A distancia entre as caixas contrólase mediante as marxes laterais.

Exemplo do comportamento do posicionamento normal

Exemplo do comportamento do posicionamento normal en CSS.

Se as caixas en liña ocupan máis espazo do dispoñible na súa propia liña, o resto de caixas móstranse nas liñas inferiores. Se as caixas en liña ocupan un espazo menor que a súa propia liña, pódese controlar a distribución das caixas mediante a propiedade text-align para centralas, aliñalas á dereita ou xustificalas.

Exemplo...

See the Pen CSS - Posicionamento normal by Diego Rodicio (@drodicio) on CodePen.

Exemplo da propiedade de posicionamento normal

Exemplo da propiedade de posicionamento normal. Diego Rodicio Álvarez. CC BY-SA

Pulsa no botón de abaixo para descargar este exemplo: