当前位置: 首页 > 知识库问答 >
问题:

引导转盘,带有封面图像和指示器

慕佑运
2023-03-14

我需要一个(响应性)引导转盘-非常像标准示例:http://getbootstrap.com/javascript/#carousel

但是,我需要每个图像“覆盖”包含的div。因此,如果它与图像的比例不同,请单击顶部

我还需要左边的

我还需要每张幻灯片中的文本随着每张幻灯片的变化而变化/不是静态的。我发现了这个,但它有静态文本-我无法让文本移动-它也缺乏导航按钮和点指示器:https://bootsnipp.com/snippets/featured/fullscreen-background-carousel

我该怎么做?谢谢。

共有1个答案

郜昊苍
2023-03-14

如果您同意使用背景图像,可以使用CSS属性background size:cover使背景图像覆盖整个旋转木马幻灯片分区。然后,您的文本也将位于幻灯片分区内,并位于背景图像的顶部。您可以在此处阅读有关背景大小的更多信息。

这里有一把小提琴演示了背景图像的使用,背景大小为:cover。

如果需要将图像加载到img标记中,那么可以使用此解决方案,使用JavaScript确定图像是宽还是高,然后应用适当的CSS样式。

 类似资料:
  • 请看下图,我们正在使用引导转盘旋转图像。但是,当窗口宽度较大时,图像不会与边框正确对齐。 但是bootstrap提供的carousel示例始终工作良好,无论窗口的宽度如何。遵循代码。 有人能解释为什么carousel的行为有所不同吗?这是否与映像大小有关,或者缺少某些引导配置?

  • 我在img标记中使用.img响应类。图像非常小(42K),但当加载页面时,图像显示几秒钟相当大,直到缩小到适合容纳它的元素的大小为止。 我应该如何使用bootstrap处理响应性元素?

  • 本文向大家介绍Android实现渐变启动页和带有指示器的引导页,包括了Android实现渐变启动页和带有指示器的引导页的使用技巧和注意事项,需要的朋友参考一下 引导页是项目中很常见的东西了,在用户下载app首次打开后,会进入引导界面,通常都是三四张图片说明,简单介绍下app的功能和使用方法之类,最后一张有着“进入应用”的按钮,点击即可进入主页,之后打开app则不会再次进入启动页,话不多说,以下做个

  • 我正在使用引导旋转木马,并试图在其中保持一个图像,以保持居中,当窗口被重新调整大小(特别是。 原始图像为1600 x 600。在大多数情况下,我希望它能填满整个页面。但是,当它缩小到移动(或类似iPad)的尺寸时,我希望它的最小尺寸为800 x 300,并在旋转木马中居中。 我尝试了以下方法,但有两件事发生了: > 图像没有居中。它保持向左对齐,向右收割。 图像奇怪地在转换之间“跳跃”。就在转换发

  • 可引导的软盘一般被视为是最后一种方法用于在那些不能从光盘引导安装程序的硬件上引导安装程序, 也适用于其他类似的情况。 磁盘映像是一些装有原始的软盘文件内容的文件。 磁盘映像,比如 boot.img 则不能直接拷贝到软盘中。 一个特殊的程序负责向软盘中 安装原始模式写入磁盘映像文件 raw 。这是一个必须的步骤,因为这些映像 文件是一些原始的磁盘保存方式。所以需要把文件的数据 按扇区拷贝 放到软盘