Авторский знак. Seosait21.ru Есть у человека надежда. Пока не поздно. Вгрызайся и изучай.
Нажимай и поддержи.

Пн Вт Ср Чт Пт Сб Вс
1 2 3 4 5 6 7
8 9 10 11 12 13 14
15 16 17 18 19 20 21
22 23 24 25 26 27 28
29 30 31


Чувашия-это моя Россия

Абсолютное позиционирование в CSS.

У абсолютно позиционируемых элементов есть три главные характеристики:

• Для объявления элементов в CSS служит конструкция {position: absolute;}.

• Элементы в CSS располагаются относительно краев охватывающего блока с учетом одного или нескольких свойств, определяющих сдвиг:

                         top
                         right
                         bottom
                         left

Свойства, оставшиеся незаданными, приобретают значение (по умолчанию) auto. Значения сдвига отсчитываются от внешнего края прямоугольника элемента (включая значение отступа, если таковой есть).

• Элементы в такой позиции полностью исключаются из потока содержимого документа. Пространство, которое они могли бы занять при традиционном их размещении, отдается для других нужд, а сами элементы перестают как бы то ни было влиять на свое окружение (например, вокруг них не происходит переноса строк текста). Так что тут дела не так просты. Приходиться немного шевелить мозгами даже при назначении значений положений элементов в блоке.

Абсолютное позиционирование и охватывающие блоки.

Первый шаг к абсолютному позиционированию элемента - поиск или создание охватывающего блока, наличие которого имеет решающее значение, поскольку все расстояния в абсолютных единицах длины будут отсчитываться от сторон блока.

Для того чтобы элемент предок являлся охватывающим блоком, он должен быть размещен по схеме absolute, relative или fixed (иными словами, быть «нестатичным» по умолчанию или явному описанию). Если ни один предок нельзя признать блоком такого рода, используется начальный охватывающий блок (html, body или viewport, в зависимости от пользовательского агента). Чтобы заставить браузер использовать как начальный охватывающий блок элемент body, добавьте стилевое правило следующего вида:

                          body {
                                position: relative;
                                }

Еще одно немаловажное обстоятельство состоит в том, что, указав схему позиционирования ненумерованного списка ul как абсолютную, превратили его в охватывающий блок для его же потомков. И если элемент li располагается абсолютно, то сдвиг, который задают свойства, будет отсчитан от сторон списка ul

                          ul#s {
                                position: absolute; 
                                left: 60px;	
                                top: 30px;	
                                background-color: #F39;
                                margin: Opx;
                                }
                           li {
							   margin: 2px;
						         }
                           li#kkk { 
                                left: 60px; 
                                top: 30px;
                                background-color: #33C;
                               	margin: 2px;
								
                                }
                                
                           < ul >
                                  < li>Для примера на странице< /li>
                                  < li id="kkk">Вы посмотрите здесь< /li>
                                  < li>Внимательно и несколько раз.< /li>
                                  < li>Только так научишься.< /li>
                           < /ul>
         
  • Для примера на странице
  • Вы посмотрите здесь
  • Внимательно и несколько раз.
  • Только так научишься.

seosait21.ru
HTML

seosait21.ru
CSS

seosait21.ru
Web-диз.
HTML ссылка CSS ссылка ...

seosait21.ru
JavaScript

seosait21.ru
PHP

seosait21.ru
JQuery
JavaScript ссылка PHP ссылка JQuery ссылка

seosait21.ru
SEO.

seosait21.ru
MySQL

seosait21.ru
XML
... ... ...

обратно на главную     назад    дальше     вперед

ПОНРАВИЛОСЬ?
ПОДЕЛИСЬ с ДРУЗЬЯМИ: