内容适配
定义
元素的内容应该如何去适应指定容器的高度与宽度。
| 工具类 | 属性 |
|---|---|
| object-contain | object-fit: contain; |
| object-cover | object-fit: cover; |
| object-fill | object-fit: fill; |
| object-none | object-fit: none; |
| object-scale-down | object-fit: scale-down; |
效果展示
包含
使用工具类 object-contain 调整元素内容的大小，使其保持在容器内。
覆盖
使用工具类 object-cover 调整元素内容的大小以覆盖其容器。
充满
使用工具类 object-fill 拉伸元素的内容以适应其容器。
无
使用工具类 object-none 以原始大小显示元素的内容，忽略容器大小。
缩小
以原始大小显示元素的内容，但必要时使用 object-scale-down 将其缩小以适应其容器。