Тег position позицирования элемнетов страницы
fon
Загружается . . . Ждите . . .
It is loaded . . . Wait . . .
Wird beladen . . . Warten Sie . . .
Es cargado . . . Esperen . . .
Est chargé . . . Attendez . . .
QR код

Тег position позицирования элемнетов страницы , relative , absolute , fixed , static , inherit .

Главная страница сайта .
srcsrc

Теги - position relative , absolute , fixed , static , inherit

inf

Тег position позицирования элемнетов страницы

infПримеры , подробности , детали

Пример :
<div style="position: relative;">content</div>
<
div style="position: relative;">content</div>
<
div style="position: relative;">content</div>
<
div style="position: relative;">content</div>
№ 1 relative; top: 0px; left: 0px;
№ 2 relative; top: 0px; left: 0px;
№ 3 relative; top: 0px; left: 0px;
№ 4 relative; top: 0px; left: 0px;
( Для наглядности и взаимного расположения элементов применён стиль style="border: 1px #000 solid;" - бордюр чёрного цвета )
Расположение элементов определяется значением тегов position , top , bottom , left , right . По умолчанию значения тегов top , bottom , left , right равно нулю . Элементы последовательно выстраиваются в соответствии с порядком следования в HTML , на взаимное положение элементов может влиять сочетание значений других тегов стилей . Допустимые единицы измерения размера : px , pt , in , cm , mm , pc , em , ex , % .
Пример :
<div style="position: relative; left: 20px; top: 5px;">content</div>
<
div style="position: relative; right: 20px; top: 0px;">content</div>
<
div style="position: relative; left: 0px; bottom: 5px;">content</div>
<
div style="position: relative; right: 5px; bottom: -20px;">content</div>
№ 1 relative; left: 20px; top: 5px;
№ 2 relative; right: 20px; top: 0px;
№ 3 relative; left: 0px; bottom: 5px;
№ 4 relative; right: 5px; bottom: -20px;
( Для наглядности и взаимного расположения элементов применён стиль style="border: 1px #000 solid;" - бордюр чёрного цвета )
Расположение элементов определяется значением тегов top , bottom , left , right . Смещение элементов по значениям тегов left , right отсчитывается от левой границы элемента , а по вертикали от линии нулевых значений тегов top , bottom местоположения элементов . Положительные значения тега left образует смещение вправо , а значение тега right влево . Отрицательные значение тега left равнозначно действию отрицательного заначения тега right и наоборот . Аналогично действие положительного и отрицательного значениий тегаов top , bottom , положительные значения тега top и отрицательные тега bottom смещают элемент вниз а отрицательные значения тега top и положительные тега bottom смещают элемент вверх . Допустимые единицы измерения размера : px , pt , in , cm , mm , pc , em , ex , % .
Пример :
<div style="position: static;">content</div>
Расположение элементов со значением позицирования static , последовательно выстраиваются в соответствии с порядком следования в HTML , на положение элементов ни какие значения тегов top , bottom , left , right не действуют .
Пример :
<div style="position: absolute; left: 0px; top: 30px;">content</div>
<
div style="position: absolute; right: 20px; top: 0px;">content</div>
<
div style="position: absolute; left: 20px; bottom: 0px;">content</div>
<
div style="position: absolute; right: 0px; bottom: 23px;">content</div>
№ 1 top: 30px; left: 0px;
№ 2 top: 0px; right: 20px;
№ 3 bottom: 0px; left: 20px;
№ 4 bottom: 23px; right: 0px;
( Для наглядности и взаимного расположения элементов применён стиль style="border: 1px #000 solid;" - бордюр чёрного цвета )
Расположение элементов при абсолютном позицировании определяется значением тегов top , bottom , left , right . Смещение по горизонтали определяется по значениям тега left от левой границы а тега right от правой границы элемета в котором расположен элемент , смещение по вертикали задаётся значением тега top от верхней а тегом bottom от нижней границы . значения могут быть как полдожительными так и отрицательными по значению . Допустимые единицы измерения размера : px , pt , in , cm , mm , pc , em , ex , % .
Пример :
<div style="position: fixed;">content</div>
Расположение элементов с фиксированным значением позицирования fixed , отображаются на странице в соответствии со значениями тегов top , bottom , left , right , относительно экрана , независимо от фактического положения на странице HTML текста и скроллинга слайдерами по горизонтали и вертикали .

Non-Commercial Use: Free Runettex_team_ESQ © 2009 - 2016 Хостинг от uCoz