Flowbite-Svelte：如何设置图片高度？size="h-10"无效问题咨询

Flowbite-Svelte的Img组件并不支持size属性，所以你用size="h-10"不会生效，以下是两种正确设置高度的方式：

• 通过Tailwind类直接设置
  将Tailwind高度类添加到class属性中，和已有样式放在一起，同时可以搭配对象适配类避免图片变形：

  <script>
    import { Img } from 'flowbite-svelte';
  </script>
  
  <Img src={image_url} alt="Listing" class="rounded-lg h-10 object-cover" />
  

  常用的对象适配类还有object-contain、object-fill，可根据需求选择。

• 使用原生HTML属性或max-height类
  也可以直接添加原生height属性，或者用max-height类来限制图片最大高度：

  <!-- 原生height属性 -->
  <Img src={image_url} alt="Listing" class="rounded-lg" height="40" />
  
  <!-- max-height类 -->
  <Img src={image_url} alt="Listing" class="rounded-lg max-h-10" />
  

如果设置后仍不生效，检查父元素是否有固定尺寸或溢出限制，调整父元素样式即可。

内容的提问来源于stack exchange，提问作者Wessi