在网页设计中，图片是不可或缺的元素。而当我们使用jQuery Mobile框架时，有时候需要将图片居中显示，但它与其他元素的排列方式可能有所不同。下面，我们就来讨论如何使图片在jQuery Mobile中居中显示。 首先，我们可以使用CSS的margin属性实现图片居中。具体来说，我们可以在样式表中为图片添加以下代码：

img {
display: block;
margin: 0 auto;
}

这段代码将使图片以块状元素方式显示，并且设置左右margin为auto，从而实现居中显示。但这种方法有一个缺点：如果图片的大小不一，就无法保证它们在水平方向上都居中。 为了解决这个问题，我们可以使用更加灵活的方法。首先，我们需要给图片所在的外层容器设置一个相对定位（position: relative），然后再给图片设置绝对定位（position: absolute）。具体来说，我们可以在HTML中添加以下代码：

<div class="container">
<img src="example.jpg" class="centered">
</div>

接着，在样式表中，我们为容器和图片分别添加以下代码：

.container {
position: relative;
}
.centered {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}

这段代码将使图片相对于容器垂直居中，并且水平方向上也会居中。其中，top、left属性将图片的偏移量设置为容器的中心坐标，而transform属性将它细微调整至完全居中。 以上就是使用jQuery Mobile居中图片的两种方法。不同的场合下可根据需求选用不同的方式，以达到最佳效果。