小枝缩略图集相对偏移量

Question

我使用的是OctoberCMS，我的缩略图库是这样生成的：

<img src="{{ image.thumb(250, 250, {mode:'crop', offset: [0,100]} ) }}">

如果图片格式为1:1，则偏移值将“超调”图片。

我正在寻找一种获取每个图像大小的顶部的方法，比如css属性

background-position: 0% 0%;

你有什么想法吗？

这里有一张图片，你可以在上面的行中看到树枝的“超长”：示例

Answer 1

为此，您可以使用background-image属性CSS，使用background-image属性可以使用background-position属性。对于background-position属性，您有更多选项这里。

注意事项：要使用backgrond-image属性，必须在缩略图生成器函数中使用自动模式。

如果您在该图像上定义了任何link，则可以在链接上使用background-image属性并在其上提供内联CSS，如下所示

<a href="your_url" 
style="background-position: center top; background-image: url({{image.getThumb(250, 250, 'auto')}})">
</a>

或者，您可以使用<a>标记代替<div>标记，并为该<div>提供<div>属性(特定的高度和宽度)，并管理您的视图。

试试这个，告诉我你的评论。