返回介绍

背景颜色及透明度

发布于 2024-03-09 15:46:42 字数 989 浏览 0 评论 0 收藏 0

This text is on the back of the model

<template>
  <div class="content">
    <div class="text">This text is on the back of the model</div>
    <div class="model">
      <vue3dLoader
        filePath="/models/gltf/DamagedHelmet.gltf"
        :backgroundColor="'#00ffff'"
        :backgroundAlpha="0.5"
        :height="600"
        :width="600"
        outputEncoding="sRGB"
      />
    </div>
  </div>
</template>
<script setup lang="ts">
import { vue3dLoader } from "vue-3d-loader";
</script>
<style>
.content {
  position: relative;
}
.text,
.model {
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
}
.text {
  z-index: 0;
  font-size: 60px;
  width: 100%;
  text-align: center;
}
.model {
  z-index: 100;
}
</style>

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。
列表为空,暂无数据
    我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
    原文