学习Bootstrap 5的第十二天

目录

轮播

轮播所使用的类说明

创建轮播

实例

轮播图片上添加描述

实例

模态框

如何创建模态框

实例

模态框尺寸

全屏模态

实例一

实例二

模态框居中显示

实例

模态框滚动条

实例


轮播

轮播所使用的类说明

描述
.carousel 创建轮播。
.carousel-indicators 为轮播添加指示器。它们是每张幻灯片底部的小点。
表示轮播中有多少张幻灯片,以及用户当前正在查看哪张幻灯片。
.carousel-inner 将幻灯片添加到轮播。
.carousel-item 规定每张幻灯片的内容。
.carousel-control-prev 向轮播添加一个向左(上一个)按钮,允许用户在幻灯片之间回退。
.carousel-control-next 向轮播添加一个向右(下一个)按钮,允许用户在幻灯片之间前进。
.carousel-control-prev-icon 与 .carousel-control-prev 一起使用,创建“上一个”按钮。
.carousel-control-next-icon 与 .carousel-control-next 一起使用,创建“下一个”按钮。
.slide 从一个项目滑到下一个项目时添加 CSS 过渡和动画效果。
如果您不想要这种效果,请删除此类。

创建轮播

实例



	
		Bootstrap5 实例
		
		
		
		
	
	
		
	

运行结果

轮播图片上添加描述

要在轮播图片上添加描述文本,你可以在每个

你可能感兴趣的:(Bootstrap,学习,bootstrap,前端)