Краткая информация
ОписаниеЗадается расстояние от правой границы родительского элемента, не включая отступ, поле и ширину рамки, до правой границы дочернего элемента. Данное свойство применяется только к позиционным элементам Отсчет координат зависит от значения параметра position. Если его аргумент равен absolute, в качестве родителя выступает окно браузера и положение элемента определяется от его правого края. В случае значения relative, аргумент right отсчитывается от правого края исходного положения элемента. АргументыВ качестве значений принимаются любые единицы длины, принятые в CSS - например, пикселы (px), дюймы (in), пункты (pt) и др. Значение параметра right может быть и отрицательным, в этом случае возможны наложения разных элементов друг на друга. При задании значения в процентах, положение элемента вычисляется в зависимости от ширины родительского элемента. Аргумент auto не изменяет положение элемента. Пример
<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=windows-1251"> <title>right</title> <style type="text/css"> #leftcol { position: absolute; /* Абсолютное позиционирование */ top: 20px; /* Положение от верхнего края */ left: 20px; /* Положение от левого края */ width: 100px; /* Ширина блока */ background: #fc0; /* Цвет фона */ border: 1px solid #000; /* Параметры рамки */ padding: 10px; /* Поля вокруг текста */ } #centercol { position: relative; /* Относительное позиционирование */ background: maroon; /* Цвет фона */ padding: 10px; /* Поля вокруг текста */ color: white; /* Цвет текста */ margin: 13px 250px 0px 130px; /* Отступы вокруг блока */ } #rightcol { position: absolute; /* Абсолютное позиционирование */ top: 20px; /* Положение от верхнего края */ right: 20px; /* Положение от правого края */ width: 240px; /* Ширина блока */ background: #ccc; /* Цвет фона */ border: 1px solid black; /* Параметры рамки */ padding: 10px; /* Поля вокруг текста */ } </style> </head> <body> <div id="leftcol">...</div> <div id="centercol">...</div> <div id="rightcol">...</div> </body> </html> | |||||||||||||||||||||||||||||||||||||||||||||||||||||||||
| Просмотров: 302 | Теги: | Рейтинг: 0.0/0 | |||||||||||||||||||||||||||||||||||||||||||||||||||||||||
| Всего комментариев: 0 | |