spz-img 图片

替换原生的img图片。

布局

何时使用

需要显示图片时。

代码演示

基本用法

最基本用法。

<spz-img
  src="https://img.staticdj.com/7fe3fa83e64a9bd1bd25b09651ce02d3.webp"
  alt="Blueberry"
  object-fit="cover"
  layout="responsive"
  width="1920"
  height="1440"
></spz-img>

属性

属性名	说明	类型	默认值	是否必需
src	要嵌入的图片的路径。与 `<img>` 的src属性一样（参考：img）	string	-	是
alt	包含一条对图像的文本描述。与 `<img>` 的alt属性一样（参考：img）	string	-	否
auto-fit	如果该属性存在，对图片进行大小优化，仅图片路径支持在文件类型前面加 `x200` 形式的路径还可以访问才支持	-	-	否
object-fit	与CSS的 `object-fit` 属性一样（参考：object-fit）	-	-	否
object-position	与CSS的 `object-position` 属性一样（参考：object-position）	-	-	否
complete	当图片加载完成时，元素会自动加入该属性	-	-	-
fallback	当图片加载失败时，如存在此属性则不展示加载失败的占位图像	-	-	否
src-unset	当src不存在时，元素自动设置此属性	-	-	-