使用一小块图像创建自定义图像

Posted

技术标签:

【中文标题】使用一小块图像创建自定义图像【英文标题】:Create custom image by using a small piece of image 【发布时间】:2015-08-10 07:26:39 【问题描述】:

我希望通过使用一小块图像来创建自定义布局。

例如:我有一张 30*30 像素的图像,现在我需要创建一个 200*200 像素的新图像(实际上是相框之类的框架)。

我研究了很多 php 的 gd 库,但没有找到任何方法。

我只需要一种方法来实现它。

我需要一个活生生的例子:https://www.pictureframesexpress.co.uk/picture-frame-designer/?stage=1

谁能告诉我在php中实现这一点的方法(我使用的是laravel4)。

提前感谢您的支持。

【问题讨论】:

【参考方案1】:

您可以使用 html 和 css 来做到这一点。那就足够了。 只需围绕图像构建一个标记结构,例如一个 div 元素作为父元素。如果您需要支持较旧的浏览器(非 CSS3),请在 CSS 中寻找“滑动门”技术。如果不是,您可以将多个背景图像(在您的情况下为框架的不同边框)分配给包含 30x30 图像的 div。

推拉门:

https://css-tricks.com/snippets/css/perfect-css-sprite-sliding-doors-button/

多个背景图片:

https://css-tricks.com/css3-multiple-backgrounds-obsoletes-sliding-doors/

【讨论】:

能否请同一个帮我通过 PHP 完成上述功能。

以上是关于使用一小块图像创建自定义图像的主要内容,如果未能解决你的问题,请参考以下文章

显示自定义 Gutenberg 块的预览图像

使用自定义参数在 Python 中多次裁剪图像

自定义 Slick 滑块设计,在图像之间留出适当的空间

如何在光滑的滑块中创建自定义箭头以在悬停时更改图像?

VueJS - 调用多个图像 src 作为自定义道具

如何使用代码为 UIButton 创建自定义图像?