aspect-ratio

aspect-ratio 是 CSS 属性，用于设置一个元素的宽高比。它可以用于任何元素，但最常用的是用于图片和视频元素。它的语法如下：

aspect-ratio: <ratio>|auto;

其中，`<ratio>` 是一个数字表示比例，例如 `16/9` 或 `4/3`，也可以是一个小数，例如 `1.5` 或 `1.3333`。`auto` 表示自适应宽高比。比如，一个宽度为 200 像素、高度为 100 像素的元素，如果设置 `aspect-ratio: 16/9;`，则高度会自动调整为 112.5 像素，以保持宽高比为 16:9。

相关问题

.img-holder { aspect-ratio: var(--width) / var(--height); overflow: hidden; background-color: var(--bg-jet); }

这段CSS代码应用于`.img-holder`类选择器，表示该样式规则将应用于具有`img-holder`类的HTML元素。让我们逐行解释它的含义：

.img-holder {
  aspect-ratio: var(--width) / var(--height);
  overflow: hidden;
  background-color: var(--bg-jet);
}

1. `aspect-ratio: var(--width) / var(--height);`：使用CSS属性`aspect-ratio`设置了元素的宽高比。这里使用了自定义变量`--width`和`--height`，它们的值可以在其他地方进行定义。通过这种方式，可以动态地设置元素的宽高比。

2. `overflow: hidden;`：设置元素的溢出内容隐藏。这意味着如果元素内部的内容超出了其指定的尺寸，超出部分将被裁剪隐藏而不显示溢出部分。

3. `background-color: var(--bg-jet);`：使用自定义变量`--bg-jet`设置了元素的背景颜色。同样，这个自定义变量的值也由其他地方定义。通过使用自定义变量，可以轻松地更改背景颜色而不需要直接修改CSS代码。

请注意，这些样式规则可能需要在合适的上下文中使用，并且可能会受到其他样式规则和浏览器的默认样式影响。同时，自定义变量的值应该在应用样式之前定义，以确保正确的值被应用。

cesiumvideo3d aspectratio

Cesium Video 3D是一个用于在三维地球模型上投射视频的开源JavaScript库。它允许将实时视频或预先录制的视频与Cesium地球模型结合，以创建生动的三维视觉效果。

AspectRatio（宽高比）是指视频的宽度和高度之间的比例关系。在Cesium Video 3D中，可以根据视频的实际宽高比来设置正确的预览比例，这样可以确保视频的内容在地球模型上正确显示，不会出现扭曲或变形的情况。

通过设置合适的aspect ratio，用户可以确保视频在投射到地球模型上时保持其原始宽高比。这是非常重要的，因为如果不正确设置宽高比，视频的内容可能会被拉伸或压缩，从而导致视觉效果的损失。

Cesium Video 3D提供了设置aspect ratio的选项，用户可以根据视频的实际宽高比来设置相应的值。通过调整aspect ratio，可以确保视频在地球模型上的投影与原始视频内容保持一致，从而提供更真实的三维视觉效果。

总而言之，Cesium Video 3D中的aspect ratio是用来确保投射在地球模型上的视频与其原始宽高比保持一致的重要参数。正确设置aspect ratio可以确保视频内容的视觉效果不会出现扭曲或变形，从而提供更好的三维观看体验。