CSS perspective-origin Свойство
Пример
Определите, с какого положения пользователь смотрит на 3D-позиционный элемент:
#div1
{
-webkit-perspective: 100px; /* Safari 4-8 */
-webkit-perspective-origin: left; /* Safari 4-8 */
perspective: 100px;
perspective-origin: left;
}
Определение и использование
Свойство perspective-origin определяет позицию, с которой пользователь смотрит на 3D-позиционный элемент.
При определении свойства perspective-origin для элемента, это дочерние элементы, которые получат эффект, а не сам элемент.
Примечание: Это свойство должно использоваться совместно с свойством перспектива!
Чтобы лучше понять свойство перспективы-Origin, Просмотрите демонстрацию.
| Значение по умолчанию: | 50% 50% |
|---|---|
| Inherited: | no |
| Animatable: | yes. Читайте о animatable |
| Version: | CSS3 |
| Синтаксис JavaScript: | object.style.perspectiveOrigin="10px 50%" |
Поддержка браузера
Номера в таблице указывают первую версию браузера, которая полностью поддерживает свойство.
Номера followed by -webkit- or -moz- Укажат первую версию, которая работала с префиксом.
| Свойство | |||||
|---|---|---|---|---|---|
| perspective-origin | 36.0 12.0 -webkit- |
10.0 | 16.0 10.0 -moz- |
9.0 4.0.3 -webkit- |
23.0 15.0 -webkit- |
Синтаксис CSS
perspective-origin: x-axis y-axis|initial|inherit;
Значения свойств
| Property Value | Описание |
|---|---|
| x-axis | Определение места размещения вида на оси x Возможные значения: |
| y-axis | Определение места размещения вида на оси y Возможные значения: |
| initial | Присваивает этому свойству значение по умолчанию. (Читайте о initial) |
| inherit | Наследует это свойство из родительского элемента. (Читайте о inherit) |
Похожие страницы
CSS Справочник: CSS 3D Transforms
HTML DOM Справочник: perspectiveOrigin Свойство