`<img>` 的 TailwindCSS 辅助类
TailwindCSS 提供了几个针对 <img>
标签的辅助类。以下是一些常用的类:
object-contain
:此类将图像设置为适应容器并保持其长宽比。它将根据需要缩小或扩大图像以确保其适合容器。object-cover
:此类将图像设置为覆盖整个容器并保持其长宽比。它将裁剪或根据需要缩小图像以确保其覆盖容器。object-fill
:此类将图像设置为填充整个容器而不维护其长宽比。这可能会导致图像被拉伸或压缩以适应容器。object-none
:此类将图像设置为其自然大小,没有任何调整大小或裁剪。object-center
:此类在其容器内水平和垂直居中图像。object-left
:此类将图像在其容器内左对齐。object-right
:此类将图像在其容器内右对齐。object-top
:此类将图像在其容器内顶部对齐。object-bottom
:此类将图像在其容器内底部对齐。
这些类可以与其他 TailwindCSS 类组合使用,以进一步样式化您的图像,例如设置特定的宽度或高度、添加边框或阴影、调整不透明度等。