perspective()

为 3D 转换元素定义透视视图。

 

语法

perspective(n)

值

值描述
n一个<length>值。它用来应用于元素的透视变换。如果它是 0 或负值，则应用没有透视变换。

例子

HTML 

<div class="stage">
  <div class="box"></div> 
</div>

CSS 

.stage{
  position: relative;
  height: 150px;
  width: 120px;
  margin: 50px;
  padding:10px;
  border: 1px solid black;
  perspective:150;
}
.box {
  padding:50px;
  position: absolute;
  border: 1px solid black;
  background-color: red;
  transform: rotateX(45deg);
}

执行结果

参考

相关页面


跳至内容顶部