Thuộc tính gốc phối cảnh CSS
Thí dụ
Xác định vị trí mà người dùng đang nhìn vào phần tử được định vị 3D:
#div1
{
perspective: 100px;
perspective-origin: left;
}
Định nghĩa và Cách sử dụng
Thuộc perspective-origin
tính xác định vị trí mà người dùng đang nhìn vào phần tử được định vị 3D.
Khi xác định thuộc perspective-origin
tính cho một phần tử, chính các phần tử CON sẽ nhận được hiệu ứng, KHÔNG PHẢI chính phần tử đó.
Lưu ý: Thuộc tính này phải được sử dụng cùng với thuộc tính phối cảnh !
Để hiểu rõ hơn thuộc tính gốc phối cảnh, hãy xem bản trình diễn .
Giá trị mặc định: | 50% 50% |
---|---|
Thừa hưởng: | không |
Hoạt hình: | Đúng. Đọc về hoạt hình |
Phiên bản: | CSS3 |
Cú pháp JavaScript: | đối tượng .style.perspectiveOrigin = "10px 50%" |
Hỗ trợ trình duyệt
Các số trong bảng chỉ định phiên bản trình duyệt đầu tiên hỗ trợ đầy đủ thuộc tính.
Các số theo sau -webkit- hoặc -moz- chỉ định phiên bản đầu tiên hoạt động với tiền tố.
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- |
Cú pháp CSS
perspective-origin: x-axis y-axis|initial|inherit;
Giá trị tài sản
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 |
Các trang liên quan
Hướng dẫn CSS: CSS 3D Transforms
Tham chiếu DOM HTML: thuộc tính perspectiveOrigin