Thuộc tính perspective của CSS

Định nghĩa và cách sử dụng

Thuộc tính perspective định nghĩa khoảng cách từ phần tử 3D đến视图, tính bằng pixel. Thuộc tính này cho phép bạn thay đổi góc nhìn khi xem phần tử 3D.

Khi định nghĩa thuộc tính perspective cho phần tử, các phần tử con sẽ nhận được hiệu ứng透视,而不是 phần tử本身.

Ghi chú:Thuộc tính perspective chỉ ảnh hưởng đến phần tử chuyển đổi 3D.

Lưu ý:Xin hãy xem: phạm vi-xuất-xứ Sử dụng thuộc tính cùng với thuộc tính này để bạn có thể thay đổi vị trí dưới cùng của phần tử 3D.

Xem thêm:

Hướng dẫn CSS3:Chuyển đổi 3D CSS3

Hướng dẫn HTML DOM:Thuộc tính perspective

Mô hình

Đặt vị trí nhìn thấy của phần tử:

div
{
perspective: 500;
}

Thử nghiệm trực tiếp

Cú pháp CSS

perspective: số|none;

Giá trị thuộc tính

Giá trị Mô tả
số Khoảng cách từ phần tử đến视图, tính bằng pixel.
không có Giá trị mặc định. Cùng với 0. Không thiết lập透视.

Chi tiết kỹ thuật

Giá trị mặc định: không có
Kế thừa:
Phiên bản: CSS3
Cú pháp JavaScript: đối tượng.style.perspective=500

Hỗ trợ trình duyệt

Số số trong bảng là phiên bản trình duyệt đầu tiên hỗ trợ đầy đủ thuộc tính này.

Số số đầu tiên với -webkit- hoặc -moz- là phiên bản đầu tiên sử dụng tiền tố.

Chrome IE / Edge Firefox Safari Opera
36.0
12.0 -webkit-
10.0 16.0
10.0 -moz-
9.0
4.0.3 -webkit-
23.0
15.0 -webkit-