模板:轮播图：修订间差异

2025年5月1日 (四) 20:12的最新版本

描述

此模板用于在维基页面上创建一个轮播图展示框，可以用来展示多个幻灯片内容。

用法

{{轮播图
|content=
{{CarouselItem
 |title=欢迎来到本站
 |description=点此进入详细介绍
 |image=Example1.jpg
 |link=Main_Page
}}
{{CarouselItem
 |title=查看项目
 |description=使用语义维基与Cargo整合数据
 |image=Example2.jpg
 |link=Projects
}}
{{CarouselItem
 |title=联系我们
 |description=点击获取联系方式
 |image=Example3.jpg
 |link=Contact
}}
}}

文件:Example1.jpg

欢迎来到本站

点此进入详细介绍

文件:Example2.jpg

查看项目

使用语义维基与Cargo整合数据

文件:Example3.jpg

联系我们

点击获取联系方式

参数

content: 包含多个幻灯片的内容

另见

Template:CarouselItem: 轮播图中单个幻灯片的模板

@@ 第1行： / 第1行： @@
+<div class="mw-carousel" id="main-carousel">
+  {{{content|}}}
+  <html>
+     <div class="carousel-navigation">
+       <button class="carousel-prev">&lsaquo;</button>
+       <div class="carousel-indicators"></div>
+       <button class="carousel-next">&rsaquo;</button>
+     </div>
+</html>
+</div>
 <includeonly>
-<div class="wiki-carousel-container">
+[[Category:使用轮播图的页面]]
-  <div class="wiki-carousel">
-    <div class="wiki-carousel-slides">
-      {{{content}}}
-    </div>
-    <button class="wiki-carousel-btn wiki-carousel-prev" aria-label="上一张">❮</button>
-    <button class="wiki-carousel-btn wiki-carousel-next" aria-label="下一张">❯</button>
-  </div>
-</div>
 </includeonly>
 <noinclude>
@@ 第16行： / 第20行： @@
 == 用法 ==
 <pre>
-{{Carousel
+{{轮播图
 |content=
-{{Carousel/Slide
+{{CarouselItem
-|image=图片1.jpg
+ |title=欢迎来到本站
-|title=标题1
+ |description=点此进入详细介绍
-|text=描述文本1
+ |image=Example1.jpg
-|link=链接页面1
+ |link=Main_Page
+}}
+{{CarouselItem
+ |title=查看项目
+ |description=使用语义维基与Cargo整合数据
+ |image=Example2.jpg
+ |link=Projects
 }}
-{{Carousel/Slide
+{{CarouselItem
-|image=图片2.jpg
+ |title=联系我们
-|title=标题2
+ |description=点击获取联系方式
-|text=描述文本2
+ |image=Example3.jpg
-|link=链接页面2
+ |link=Contact
 }}
 }}
 </pre>
+{{轮播图
+|content=
+{{CarouselItem
+ |title=欢迎来到本站
+ |description=点此进入详细介绍
+ |image=Example1.jpg
+ |link=Main_Page
+}}
+{{CarouselItem
+ |title=查看项目
+ |description=使用语义维基与Cargo整合数据
+ |image=Example2.jpg
+ |link=Projects
+}}
+{{CarouselItem
+ |title=联系我们
+ |description=点击获取联系方式
+ |image=Example3.jpg
+ |link=Contact
+}}
+}}
 == 参数 ==
@@ 第37行： / 第68行： @@
 == 另见 ==
-* [[Template:Carousel/Slide]]: 轮播图中单个幻灯片的模板
+* [[Template:CarouselItem]]: 轮播图中单个幻灯片的模板
 </noinclude>
-<includeonly>
-[[Category:使用轮播图的页面]]
-</includeonly>