Mafunzo ya kusikitisha:

Funkniji ya CSS perspective()

Inaeleza na kutumia perspective() CSS

perspective() Funkniji inaeleza kimaana wa mtu na ujauzito wa z=0. transform kwenye kina ya sababu.

Mfano

Kutumia perspective() Ongeza muafikio kwa mitatu ya kati:

.cube1 {
  font-size: 4em;
  width: 2em;
  margin: 1.5em auto;
  transform-style: preserve-3d;
  transform: perspective(5cm) rotateX(-15deg) rotateY(30deg);
}
.cube2 {
  font-size: 4em;
  width: 2em;
  margin: 1.5em auto;
  transform-style: preserve-3d;
  transform: perspective(10cm) rotateX(-15deg) rotateY(30deg);
}

Mfanye tena

Muundo wa CSS

perspective(length|none)
Inaamua Maelezo
length Inayotakiwa. Inaeleza kimaana wa mtu na ujauzito wa z=0. none inaeleza ukiona hali ya muafikio.

Vivyo ya teknolojia

Toleo: CSS Transforms Module Level 2

Kusimamia kwenye kifungaji

Inaamua za kusimamia kwenye tabia zinaonyesha menginezo wa kwanza ambao zinafanya fungniji hii.

Chrome Edge Firefox Safari Opera
perspective()
12 12 10 4 15
perspective(none)
97 97 93 15.4 83

Mawasiliano ya kusikitisha

Mafunzo:Muafikio wa CSS 3D

Tazama:Mafuta wa transform wa CSS

Tazama:Funkniji ya CSS rotate()

Tazama:Funkniji ya CSS rotate3d()

Tazama:Funkniji ya CSS rotateX()

Tazama:Fani la rotateY() la CSS

Tazama:Fani la rotateZ() la CSS