css中的景深是指物體距離視角越遠，它在頁面上顯示的大小也就越小，以達到逼真的3D效果。

{
perspective: 500px;
transform: translateZ(-200px);
}

上面的代碼中，我們通過設置perspective屬性來定義一個觀察者和z=0平面之間的距離，以便定義景深。

使用transform屬性的translateZ函數來設置物體沿Z軸方向的距離，值越小，距離就越近，物體就越大；反之，值越大，距離就越遠，物體就越小。

通過動態調整物體與觀察者之間的距離，可以實現頁面元素隨著鼠標的互動而出現縮小、拉近等立體效果。

{
border: solid 2px;
transform: perspective(500px) rotateY(45deg);
}

在三維變換中，我們還可以使用rotateX、rotateY和rotateZ分別對物體進行繞X、Y、Z軸旋轉，從而實現立體旋轉的效果。

總之，使用CSS中的景深效果，可以方便地給頁面元素增加逼真的3D立體效果，提升頁面的視覺效果和用戶體驗。