在JSP页面中，图片的布局和显示效果对于提升页面的美观度和用户体验至关重要。其中，图片上下居中显示是一种常见的布局方式。本文将为大家详细讲解如何在JSP页面中实现图片上下居中显示，并通过实例代码进行演示。
1. 前言
在进行JSP页面开发时，我们经常会遇到需要在页面中显示图片的需求。图片的显示效果直接影响着页面的美观度。在众多图片布局方式中，图片上下居中显示是一种非常实用的布局方式。下面，我们就来一起学习如何在JSP页面中实现图片上下居中显示。
2. 图片上下居中显示原理
在JSP页面中，实现图片上下居中显示主要有以下两种方法：
1. 使用CSS样式：通过CSS样式设置图片的`display`属性为`flex`，并使用`justify-content`和`align-items`属性实现图片上下居中。
2. 使用HTML标签：通过嵌套`div`标签，并设置内层`div`的`position`属性为`absolute`，外层`div`的`position`属性为`relative`，实现图片上下居中。
3. 使用CSS样式实现图片上下居中显示
下面，我们以使用CSS样式实现图片上下居中显示为例，为大家进行详细讲解。
3.1 创建HTML页面
我们需要创建一个HTML页面，并在其中插入图片。以下是页面代码：
```html
