图片展示示例

这个页面展示了美化后的图片显示功能，包括可折叠的图片和图片集。

单张图片折叠

以下是单张图片折叠的示例：

▼

Hugo Logo

这是 Hugo 的官方标志。Hugo 是一个用 Go 语言编写的静态网站生成器，以其速度快和灵活性而闻名。

▼

Go Gopher

这是 Go 语言的吉祥物 Gopher。Go 是一种开源编程语言，旨在提高程序员的生产力。

• Go 由 Google 开发
• 它是一种静态类型的编译语言
• 它的语法类似于 C，但具有垃圾收集、内存安全等特性

图片集折叠

以下是图片集折叠的示例：

▼

编程语言标志集

▼

自然风景

使用说明

单张图片折叠

使用 image-fold shortcode 来创建可折叠的单张图片：

{{< image-fold title="图片标题" src="图片URL" alt="替代文本" caption="图片说明" >}}
可选的图片描述文本（支持Markdown格式）
{{< /image-fold >}}

如果希望默认展开，可以添加 open=true 参数。

图片集折叠

使用 image-gallery 和 gallery-image shortcodes 来创建可折叠的图片集：

{{< image-gallery title="图片集标题" >}}
  {{< gallery-image src="图片1URL" caption="图片1说明" >}}
  {{< gallery-image src="图片2URL" caption="图片2说明" >}}
  {{< gallery-image src="图片3URL" caption="图片3说明" >}}
{{< /image-gallery >}}

同样，如果希望默认展开，可以添加 open=true 参数。

特点

1. 可折叠显示：点击标题栏可以展开或折叠图片内容
2. 美观的样式：图片带有圆角和阴影效果
3. 响应式设计：在不同屏幕尺寸下自动调整布局
4. 图片说明：支持添加图片说明文字
5. 点击放大：点击图片可以在模态框中查看大图
6. Markdown支持：在图片描述中可以使用Markdown格式