The perspective-originharta menentukan asal untuk perspectiveharta. Anggaplah ia sebagai titik hilang dari ruang 3D semasa.
Perhatikan untuk perspectiveharta tanah, perspective-originharus ditentukan pada elemen induk untuk memberi kedalaman anak yang diubah.
Tempat perspective-originpenginapan ini tidak melakukan apa-apa. Ia mesti didefinisikan pada elemen bersamaan perspective.
/** * Syntax * perspective-origin: x-position * perspective-origin: x-position y-position * * perspective-origin:
| | constants | inherit */ .element1 ( perspective-origin: 25% 75%; ) .element2 ( perspective-origin: 10px 25px; ) .element3 ( perspective-origin: left bottom; ) Di bawah ini adalah demo yang menunjukkan bagaimana kiub 3D berkelakuan ketika mengubah titik hilangnya dengan mengubah perspective-originnilai (pemalar).
Hei, mari kita menghidupkan perspektif-asal, hanya untuk bersenang-senang!
- Ia bermula pada `0% 0%` (kiri atas)
- Kemudian pergi ke `100% 0%` (kanan atas)
- Kemudian ke `100% 100% '(kanan bawah)
- Kemudian ke `0% 100%` (kiri bawah)
- Kemudian kembali ke 1. dan mulakan semula
Sokongan Penyemak Imbas
Data sokongan penyemak imbas ini berasal dari Caniuse, yang mempunyai lebih terperinci. Nombor menunjukkan bahawa penyemak imbas menyokong ciri pada versi dan ke atas.
Desktop
| Chrome | Firefox | IE | Hujung | Safari |
|---|---|---|---|---|
| 12 * | 10 * | 11 | 12 | 4 * |
Mudah Alih / Tablet
| Android Chrome | Android Firefox | Android | Safari iOS |
|---|---|---|---|
| 88 | 85 | 3 * | 3.2 * |