Прочетох толкова много за абсолютното и относителното позициониране, но все още не го разбирам правилно. Каква е практическата употреба на Абсолютно и относително позициониране и кога трябва да ги използвам точно?
Отговори:
0 за отговор № 1абсолютно: Елементът е позициониран спрямо неговия първи позициониран (не статичен) предшественик
относителна: Елементът е позициониран спрямо нормалното му положение
Това казва на браузъра, че всичко, което ставатрябва да бъде отстранен от нормалния поток на документа и ще бъде поставен на точното място на страницата. Също така се изважда от нормалния поток на документа - той няма да повлияе върху това как елементите, които са били преди или след него в HTML, са разположени на уеб страницата.
Ако искате да позиционирате елемент 10ems от горната част на прозореца на документа, ще използвате "горния" отместване, за да го позиционирате там с абсолютно позициониране:
position: absolute;
top: 10em;
След това този елемент винаги ще се покаже с десета от най-горната част на страницата - независимо от това, какво още показва в нормалния поток.
Относителното позициониране използва същите четирипозициониращите свойства като абсолютно позициониране. Но вместо да се базира позицията на елемента върху изгледа на браузъра, то започва откъде е елементът, ако все още е в нормалния поток.
Например, ако имате три параграфа във вашияУеб страница, а третата има позиция: поставен върху нея относителен стил, позицията му ще бъде изместена въз основа на текущото местоположение - не от оригиналните страни на изгледа за порт.
<p>Paragraph 1.</p>
<p>Paragraph 2.</p>
<p style="position: relative;left: 2em;">Paragraph 3.</p>
В горния пример ще бъде третият параграфразположени 3м от лявата страна на контейнерния елемент, но все пак ще бъдат под първите два параграфа. Тя ще остане в нормалния поток на документа и просто ще бъде леко компенсирана. Ако го промените на позиция: абсолютно; всичко, което следва, ще се появи върху него, защото вече няма да бъде в нормалния поток на документа.