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

Question

我正在尝试为 aframe element but it fills the window despite any styling I apply. I'm trying to have my aframe 360 image set to 300px high and 300px wide: 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

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

A-Frame - Setting Height and Width

css

webvr

aframe