three.js中简单粗暴实现渐变色背景__css 渐变色

相关文章推荐

独立的松鼠 · android gradle ...· 2 月前 ·

谦逊的面包 · Entity Framework 异常： ...· 3 月前 ·

千杯不醉的红烧肉 · 在java程序中开启另一个java程序_在一 ...· 4 月前 ·

谈吐大方的烤土司 · SpringDataJPA+Hibernat ...· 1 年前 ·

首先需要实现渲染器的背景透明显示

this.renderer = new THREE.WebGLRenderer({
    alpha: true, // canvas是否包含alpha (透明度) 默认为 false
    antialias: true,
    precision: 'highp',
})
this.renderer.setClearAlpha(0.0) // 设置alpha，合法参数是一个 0.0 到 1.0 之间的浮点数

使用css设置渲染器元素所在dom背景

#container {
    width: 100%;
    height: 600px;
    outline: none;
    background-image: linear-gradient(rgb(0, 0, 1), rgb(119, 119, 237));
}

另外需要注意的是，不能为 Scene 指定背景色

three.js中简单粗暴实现渐变色背景_3d

推荐文章

独立的松鼠 · android gradle 8.0.1构建失败（Could not resolve com.android.tools.build:gradle:8.0.1.）-CSDN博客

2 月前

谦逊的面包 · Entity Framework 异常： 'OFFSET' 附近有语法错误。\r\n在 FETCH 语句中选项 NEXT 的用法无效。\r\n关键字 'AS' 附近有语法错误。 - 不是豆豆 - 博客

3 月前

千杯不醉的红烧肉 · 在java程序中开启另一个java程序_在一个java程序里启动另外一个java程序并且守护-CSDN博客

4 月前

谈吐大方的烤土司 · SpringDataJPA+Hibernate框架源码剖析（四）框架整合之事务管理器的构建（包括spring的事务机制） - 知乎

1 年前