CSS left Свойство
Пример
Установите левый край позиционного элемента <div>, 150px от левого края его ближайшего расположенного предка:
div.c {
position: absolute;
left:
150px;
width: 200px;
height: 120px;
border: 3px solid
green;
}
Подробнее примеры ниже.
Определение и использование
Свойство left влияет на горизонтальное положение позиционного элемента. Это свойство не влияет на нерасположенные элементы.
- Если позиция: абсолютная; или положение: Исправлено; - Свойство
leftустанавливает левый край элемента в единицу слева от левого края его ближайшего расположенного предка. - Если позиция: относительная; - Свойство
leftустанавливает левый край элемента на единицу влево/вправо от его нормального положения. - Если позиция: липкий; - Свойство
leftсебя, как его позиция является относительной, когда элемент находится внутри видового экрана, и, как его положение фиксируется, когда он находится снаружи. - Если позиция: статическая; - Свойство
leftне имеет эффекта.
| Значение по умолчанию: | auto |
|---|---|
| Inherited: | no |
| Animatable: | yes. Читайте о animatable |
| Version: | CSS2 |
| Синтаксис JavaScript: | object.style.left="100px" |
Поддержка браузера
Номера в таблице указывают первую версию браузера, которая полностью поддерживает свойство.
| Свойство | |||||
|---|---|---|---|---|---|
| left | 1.0 | 5.5 | 1.0 | 1.0 | 5.0 |
Синтаксис CSS
left: auto|length|initial|inherit;
Значения свойств
| Значение | Описание | |
|---|---|---|
| auto | Позволяет обозревателю рассчитать положение левого края. Это значение по умолчанию | |
| length | Устанавливает левое положение края в px, cm, etc. Допустимы отрицательные значения. Читать о единицах длины | |
| % | Задает положение левого края в% от содержащего элемента. Допустимы отрицательные значения | |
| initial | Присваивает этому свойству значение по умолчанию. (Читайте о initial) | |
| inherit | Наследует это свойство из родительского элемента. (Читайте о inherit) |
Другие примеры
Пример
Используйте свойство Left с отрицательным значением и для элемента без позиционных предков:
div.b {
position: absolute;
left: -10px;
width: 100px;
height: 120px;
border: 3px solid blue;
}
div.c {
position: absolute;
left: 150px;
width: 200px;
height: 120px;
border: 3px solid green;
}
Похожие страницы
CSS Справочник: CSS Positioning
CSS Справка: right Свойство
CSS Справка: bottom Свойство
CSS Справка: top Свойство
HTML DOM Справочник: left Свойство