Properti asal perspektif CSS
Contoh
Tentukan dari posisi mana pengguna melihat elemen yang diposisikan 3D:
#div1
{
perspective: 100px;
perspective-origin: left;
}
Definisi dan Penggunaan
Properti perspective-origin
menentukan dari posisi mana pengguna melihat elemen yang diposisikan 3D.
Saat mendefinisikan perspective-origin
properti untuk sebuah elemen, elemen CHILD-lah yang akan mendapatkan efeknya, BUKAN elemen itu sendiri.
Catatan: Properti ini harus digunakan bersama dengan properti perspektif !
Untuk lebih memahami properti perspektif-asal, lihat demo .
Nilai bawaan: | 50% 50% |
---|---|
Diwarisi: | tidak |
Animasi: | Ya. Baca tentang animasi |
Versi: kapan: | CSS3 |
Sintaks JavaScript: | objek .style.perspectiveOrigin="10px 50%" |
Dukungan Peramban
Angka-angka dalam tabel menentukan versi browser pertama yang sepenuhnya mendukung properti.
Angka yang diikuti oleh -webkit- atau -moz- menentukan versi pertama yang berfungsi dengan awalan.
Property | |||||
---|---|---|---|---|---|
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- |
Sintaks CSS
perspective-origin: x-axis y-axis|initial|inherit;
Nilai properti
Property Value | Description |
---|---|
x-axis | Defining where the view is placed at the x-axis Possible values:
Default value: 50% |
y-axis | Defining where the view is placed at the y-axis Possible values:
Default value: 50% |
initial | Sets this property to its default value. Read about initial |
inherit | Inherits this property from its parent element. Read about inherit |
Halaman Terkait
Tutorial CSS: Transformasi 3D CSS
Referensi DOM HTML: properti perspektifOrigin