Teknologian jakaminen

HTML(28)——Spatiaalinen muunnos

2024-07-12

한어Русский языкEnglishFrançaisIndonesianSanskrit日本語DeutschPortuguêsΕλληνικάespañolItalianoSuomalainenLatina

Avaruus: Koordinaattiakselin kulmasta määritellyt kolme koordinaattiakselia XYZ muodostavat kolmiulotteisen avaruuden Z-akselin sijainti on sama kuin tähtäyssuunta.

tilan muunnos

Panoroida

Ominaisuudet:

  • muunnos: translate3d(x,y,z);
  • muunnos: translateX();
  • muunnos: translateY();
  • muunnos: translateZ();

Arvo: pikseliyksikön arvo/prosentti

Oletuksena emme voi nähdä Z-akselin translaatiota

näköetäisyys

Toiminto: Määrittää tarkkailijan ja tason z=0 välisen etäisyyden ja lisää elementtiin perspektiivitehosteen

Perspektiivivaikutus: lähellä suuria, paljon pieniä, lähellä todellisia ja kaukana virtuaalisia

Ominaisuudet:(Lisätty ylätasoon, arvoalue 800-1200)

perspektiivi: näköetäisyys;

  1.   <style>
  2.     /*空间转换*/
  3.     .father {
  4.       perspective: 1000px;
  5.  
  6.     }
  7.  
  8.     .box {
  9.       width: 200px;
  10.       height: 200px;
  11.       margin: 100px auto;
  12.       background-color: blue;
  13.       transition: all 0.5s;
  14.     }
  15.  
  16.     .box:hover {
  17.       transform: translateZ(-400px);
  18.     }
  19.   </style>
  20. </head>
  21.  
  22. <body>
  23.   <div class="father">
  24.     <div class="box"></div>
  25.   </div>
  26. </body>

 

Kun hiiri leijuu, syntyy lähes suuri ja hyvin pieni tehoste, ja Z-akseli liikkuu -400 pikseliä.

 

kiertää

Vasemman käden sääntö:

Ominaisuus: Positiivinen tai negatiivinen arvo määräytyy pyörimissuunnan mukaan. Pidä pyörivästä akselista kiinni vasemmalla kädelläsi, Peukalo osoittaa positiiviseen suuntaan.Muiden sormien taivutussuunta on positiivinen pyörimissuunta

transform:rotateZ(arvo)

muunnos:rotateX(arvo)

transform:rotateY(arvo)

Henkilökohtainen profiili

Hän on omistautunut teknologian tutkimukselle yli 30 vuoden ajan ja hallitsee useita kieliä, kuten java, linux, javascript, php, css jne. Hän on tehnyt paljon työtä avoimen lähdekoodin alalla Kehittäjän dokumentaatioasema jakaaksesi joitain teknologian kehityksen ongelmia tulevaa käyttöä varten

yhteystietoni

Mail