如何在浏览器中更改 <a-scene> 的大小？

如何解决如何在浏览器中更改 <a-scene> 的大小？

我不想全屏显示我的 a 场景。我试图将“嵌入”添加到场景中，然后用 css 更改它，但这不起作用。我的html：

<!DOCTYPE html>
<html>
  <link rel="stylesheet" href="css/style.css">
<script src="aframe/aframe.js"></script>
<script src="js/aframe-ar.js"></script>
<script src="js/gestures.js"></script>

<body style="margin : 0px; overflow: hidden;">
  <a-scene embedded arjs renderer="logarithmicDepthBuffer: true;" gesture-detector
    id="scene">
    <a-marker type="pattern" preset="custom" url="/pattern/ifgi-pattern.patt" id="a-marker">
      <a-entity position="0 0 0" scale="0.8 0.8 0.8" gltf-model="/gltf/car_model/scene.gltf" class="clickable"
        gesture-handler="minScale: 0.25; maxScale: 10" id="a-entity"></a-entity>
    </a-marker>
    <a-entity camera id="camera">
  </a-scene>
  <script src="js/main.js"></script>
</body>
</html>

和我的 css：

.a-scene { display: block; width: 50%; }

有谁知道如何解决这个问题？我只想添加一个引导导航栏，但场景总是与导航栏重叠。感谢您的帮助！