Нормалният поток е начинът, по който елементите се показват в уеб страница в повечето случаи. Всички елементи в HTML са вътре в кутии, които са или вградени полета или блокови кутии.
Поставяне на блокови кутии
При нормален поток блоковите полета се позиционират на страница една след друга (в реда, в който са написани в HTML ). Те започват в горния ляв ъгъл на кутийката и се подреждат отгоре надолу. Разстоянието между всяка кутия се определя от полетата с горния и долния ръб, които се свиват един в друг.
Например може да имате следния HTML:
Това е първото издание. Той е с ширина 200 пиксела и около него има 5px маркер.
Това е по-широк разказ.
Това е чудо, което е малко по-голямо от второто.
Всеки DIV е блоков елемент, така че той ще бъде поставен под предишния блоков елемент. Всеки ляв външен ръб ще докосне левия край на съдържащия блок.
Поставяне на вътрешни кутии
Вътрешните кутии са разположени на страницата хоризонтално, един след друг, започвайки от горната част на контейнерния елемент. Когато няма достатъчно място, за да се поберат всички елементи на вградената клетка на една линия, те се увиват до следващия ред и се подреждат вертикално оттам.
Например, в следния HTML:
Този текст е смел и този текст е курсив . И това е обикновен текст.
Параграфът е блоков елемент, но има 5 вградени елемента:
- "Този текст е"
- "Смели"
- "и този текст е"
- "курсив"
- "И това е обикновен текст."
Така че нормалният поток е как тези блокови и инлайн линии ще се показват на уеб страницата без намеса на уеб дизайнера.
Ако искате да повлияете на това, къде е даден елемент на дадена страница, можете да използвате позициониране на CSS или плаващи CSS .