Normální průtok

Normální tok je způsob, jakým jsou prvky ve většině případů zobrazovány na webové stránce. Všechny prvky v HTML jsou uvnitř políček, které jsou buď vložené nebo blokové .

Vytvoření blokových bloků

V normálním toku jsou blokové políčka umístěny na jedné stránce za sebou (v pořadí, v jakém jsou napsány v HTML ). Zahajují se v levém horním rohu pole obsahující a skladují se shora dolů. Vzdálenost mezi jednotlivými krabicemi je definována okraji s horním a dolním okrajem, které se vzájemně sbíhají.

Například můžete mít následující HTML:

Toto je první div. Má šířku 200 pixelů a okraj je kolem 5 pixelů.

Toto je širší div.

Toto je div, který je trochu širší než druhý.

Každý DIV je blokový prvek, takže bude umístěn pod předchozím blokovým prvkem. Každá levá vnější hrana se dotkne levého okraje bloku obsahujícího.

Umístění inline skříněk

Inline skříně jsou umístěny na stránce vodorovně, jedna za druhou začínající v horní části kontejneru. Pokud není dostatek místa, aby se vešly všechny prvky inline krabice na jeden řádek, zabalí do dalšího řádku a odtamtud skladují svisle.

Například v následujícím kódu HTML:

Tento text je tučný a tento text je kurzívou . A to je prostý text.

Odstavec je blokový prvek, ale existují 5 čárových prvků:

Takže normální tok je, jak se tyto blokové a inline prvky zobrazí na webové stránce bez jakéhokoli zásahu webdesignera.

Pokud chcete ovlivnit, kde je prvek umístěn na stránce, můžete použít CSS positioning nebo CSS floats .