引导图像/视频上传和预览

Posted 2023-05-07

【中文标题】引导图像/视频上传和预览

【英文标题】：Bootstrap image/video upload and preview

【发布时间】：2020-02-25 05:14:00

【问题描述】：

您好，我们目前正在使用引导模板制作网站。数据库驱动。 javascript、php等

我们想知道是否有人知道解决我们面临的问题的好方法。

我们将成为一个广告平台。我们有一个帖子广告部分，分为 3 个步骤。

输入数据。 上传图片。 预览广告。

媒体显示为 1 张大图以及下面的 x 张图片作为可点击的缩略图。

这很好，但我们注意到我们的解决方案似乎是调整图像大小以使其适合该区域，而不是保持其比例。

现在我们已经注意到这一点，还有其他一些事情让我们对我们的解决方案感到恼火，主要是没有视频上传和播放。

我想知道是否有人知道他们可以推荐的好的解决方案？

【参考方案1】：

“这很好，但我们注意到我们的解决方案似乎是调整图像大小以使其适合该区域，而不是保持其比例。” 为此，您将需要一点 CSS 图像的容器应具有固定宽度，而图像的全宽应为 100%，例如

<div class="container"><img class="img-fluid" src="myimage.jpg" /></div>

这里的“img-fluid”是 (width-100) 类，它在旧的引导版本上可能是“img-responsive”

既然我们已经注意到这一点，我们的解决方案还有其他让我们烦恼的事情，主要是没有视频上传和播放

在此处查看此解决方案video embed

希望对你有帮助