浅谈H5图片中object-fit的属性及含义/ 小程序image mode属性中scaleToFill,aspectFit,widthFix等类似

网友投稿 1258 2022-11-17

浅谈H5图片中object-fit的属性及含义/ 小程序image mode属性中scaleToFill,aspectFit,widthFix等类似

浅谈H5图片中object-fit的属性及含义/ 小程序image mode属性中scaleToFill,aspectFit,widthFix等类似

我们在H5中对于图片的属性包含如下:

object-fit属性有哪些值呢?  object-fit: fill;   object-fit: contain;   object-fit: cover;   object-fit: none;   object-fit: scale-down; fill: 中文释义“填充”。默认值。替换内容拉伸填满整个contentbox,不保证保持原有的比例。contain: 中文释义“包含”。保持原有尺寸比例。保证替换内容尺寸一定可以在容器里面放得下。因此,此参数可能会在容器内留下空白。cover: 中文释义“覆盖”。保持原有尺寸比例。保证替换内容尺寸一定大于容器尺寸,宽度和高度至少有一个和容器一致。因此,此参数可能会让替换内容(如图片)部分区域不可见(上面讲解的例子就是如此)。none: 中文释义“无”。保持原有尺寸比例。同时保持替换内容原始尺寸大小。scale-down: 中文释义“降低”。就好像依次设置了none或contain, 最终呈现的是尺寸比较小的那个。

版权声明:本文内容由网络用户投稿,版权归原作者所有,本站不拥有其著作权,亦不承担相应法律责任。如果您发现本站中有涉嫌抄袭或描述失实的内容,请联系我们jiasou666@gmail.com 处理,核实后本网站将在24小时内删除侵权内容。

上一篇:C++静态成员和友元成员的理解
下一篇:CF711D-Directed Roads(组合数学 dfs找环)
相关文章

 发表评论

暂时没有评论,来抢沙发吧~