# 纵横比

在所需的比率内显示内容。

```jsx
<AspectRatio ratio={16 / 8}>
  <img
    src="https://images.unsplash.com/photo-1479030160180-b1860951d696?&auto=format&fit=crop&w=1200&q=80"
    alt="森林中的房子"
    style={{
      objectFit: "cover",
      width: "100%",
      height: "100%",
      borderRadius: "var(--radius-2)",
    }}
  />
</AspectRatio>
```

## [API 参考](#api-参考)

该组件继承自 [纵横比原语](/primitives/docs/components/aspect-ratio) 的属性。

<!--$-->

<!--/$-->