代码语言：html

所属分类：其他

代码由gpt-6 ai生成，可能有错误，仅供参考：点击查看提示词

代码描述：three实现房间图片转三维灰摸建模场景代码

代码标签： three 房间 图片 转 三维 灰摸 建模 场景 代码

下面为部分代码预览，完整代码请点击下载或在bfwstudio webide中打开

<!doctype html>
<html lang="zh-CN">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>旧屋室内场景 · 三维灰模机位预览</title>
<style>
:root {
  --site-primary: #c5cdd3;
  --site-on-primary: #111820;
  --site-secondary: #303941;
  --site-on-secondary: #eef2f5;
  --site-background: #171c21;
  --site-on-background: #e8edf1;
  --site-font-body: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --site-font-heading: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --site-heading-scale: 1;
  --site-spacing-scale: 1;
  --site-radius-scale: 1;
  --site-decoration-opacity: 1;
  --surface: #222a31;
  --surface-2: #29323a;
  --line: #414b54;
  --muted: #a4afb8;
  --accent: #c6d0d8;
}
* { box-sizing: border-box; }
html, body { margin: 0; width: 100%; height: 100%; overflow: hidden; }
body { font-family: var(--site-font-body); background: var(--site-background); color: var(--site-on-background); }
button, input { font: inherit; }
button { cursor: pointer; }
#app {
  width: 100%; height: 100%; min-height: 480px; border-radius: 0;
  display: flex; flex-direction: column; overflow: hidden;
  background-color: var(--site-background);
  color: light-dark(#202830, var(--site-on-background));
  color-scheme: light dark;
  position: relative;
}
.topbar {
  height: 62px; flex: 0 0 62px; display: flex; align-items: center; gap: 16px;
  padding: 0 calc(18px * var(--site-spacing-scale)); background: var(--site-secondary);
  color: var(--site-on-secondary); border-bottom: 1px solid var(--line); z-index: 3;
}
.brand { display: flex; align-items: center; gap: 11px; min-width: 250px; }
.brandmark { width: 31px; height: 31px; border: 1px solid #aab4bd; border-radius: calc(8px * var(--site-radius-scale)); display:grid;place-items:center; color:#e7edf1; background:#222a31; font-size: 15px; }
.brand h1 { margin: 0; font-size: calc(15px * var(--site-heading-scale)); line-height:1.2; letter-spacing:.02em; font-weight:650; }
.brand small { display:block; color:#aab5bd; font-size:11px; margin-top:3px; }
.top-actions { display:flex; align-items:center; gap:8px; margin-left:auto; flex-wrap:nowrap; }
.btn {
  border: 1px solid var(--line); background: #252e36; color: #dfe5e9; padding: 8px 12px;
  border-radius: calc(8px * var(--site-radius-scale)); font-size: 12px; transition: .16s ease;
  white-space: nowrap;
}
.btn:hover { background:#36414a; border-color:#78858f; }
.btn.primary { background:var(--site-primary); border-color:var(--site-primary); color:var(--site-on-primary); font-weight:650; }
.btn.primary:hover { background:#e0e6ea; }
.btn.active { border-color:#d8e0e6; background:#48545e; color:#fff; }
.btn:focus-visible, input:focus-visible { outline:2px solid #e6eef4; outline-offset:2px; }
.workspace { flex:1; min-height:0; display:flex; }
.sidebar {
  width: 270px; flex:0 0 270px; overflow:auto; padding: calc(15px * var(--site-spacing-scale));
  background: var(--surface); border-right:1px solid var(--line); color:#e6ebef;
}
.section { margin-bot.........完整代码请登录后点击上方下载按钮下载查看

网友评论0

取消

评论提交中...

提交评论