<div class=“text3d”>
<span> Hello World</span>

</div>
<style>
.text3d {
  display: inline-block;
  font-size: 60px;
  perspective: 500px; /* 相機(jī)距離 */
}


.text3d > span {
  display: block;
  transform-origin: center;
  transform-style: preserve-3d;
  transition: transform 1s ease-in-out;
}

.text3d:hover > span {
  transform: rotateX(360deg) rotateY(360deg);
}

</style>

當(dāng)鼠標(biāo)懸停在.text3d元素上時(shí)，通過(guò)改變.text3d > span的transform屬性，可以使文字旋轉(zhuǎn)形成3D效果。這里使用了perspective屬性來(lái)創(chuàng)建一個(gè)近大遠(yuǎn)小的視覺(jué)效果，使3D旋轉(zhuǎn)更加立體。

要為每個(gè)字母創(chuàng)建3D效果，可以將每個(gè)字母放在單獨(dú)的<span>標(biāo)簽中，并對(duì)每個(gè)<span>應(yīng)用不同的旋轉(zhuǎn)和位置。

注意：以上代碼示例為了簡(jiǎn)潔，省略了對(duì)字母進(jìn)行具體旋轉(zhuǎn)和位置的CSS規(guī)則。在實(shí)際應(yīng)用中，你需要為每個(gè)字母指定不同的旋轉(zhuǎn)角度和位置，以創(chuàng)建復(fù)雜的3D效果。