css - A 型框架 - 设置高度和宽度

Question

我正在尝试为我的 aframe 设置高度和宽度元素，但它会填满窗口，尽管我应用了任何样式。我正在尝试将我的 aframe 360​​ 图像设置为 300 像素高和 300 像素宽:CODEPEN DEMO

body {
  background: #fff;
}

.container {
  position: absolute;
  margin: auto;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background: #f66;
  height: 300px;
  width: 300px;
  overflow: hidden;
}

a-scene {
  opacity: .5;
  height: 300px;
  width: 300px;
}

Answer 1

这是因为，默认情况下，a-scene使用未修改的源 JS 将添加 class="fullscreen"

您可以覆盖它，也可以简单地添加 embedded <a-scene> 的参数像这样标记:

<a-scene antialias="true" embedded>
    <a-sky src="https://ucarecdn.com/e1c757bc-73ee-4efe-b068-4f778ce212a3/" rotation="0 -20 0"></a-sky>
</a-scene>

当然还有一个 Forked Example