圖片在網(wǎng)頁設計中占據(jù)了重要的地位，利用jQuery Mobile可以讓圖片的顯示更加容易。下面將介紹如何使用jQuery Mobile顯示圖片。 首先，需要將圖片嵌入到網(wǎng)頁中。例如，以下是一張圖片：

<img src="image.jpg" alt="圖片">

然后，將jQuery Mobile庫添加到網(wǎng)頁中：

<script src="http://code.jquery.com/jquery-1.11.3.min.js"></script>
<link rel="stylesheet" >
<script src="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"></script>

接下來，將圖片放在頁面中的一個容器中，例如一個div元素：

<div id="imageContainer">
<img src="image.jpg" alt="圖片">
</div>

使用以下代碼，可以將圖片縮小到容器大小，讓圖片適應不同設備的屏幕：

$('#imageContainer img').on('load', function() {
var maxWidth = $('#imageContainer').width();
var maxHeight = $('#imageContainer').height();
var ratio = 0;
var width = $(this).width();
var height = $(this).height();
if (width >maxWidth) {
ratio = maxWidth / width;
$(this).css('width', maxWidth);
$(this).css('height', height * ratio);
height = height * ratio;
width = width * ratio;
}
if (height >maxHeight) {
ratio = maxHeight / height;
$(this).css('height', maxHeight);
$(this).css('width', width * ratio);
width = width * ratio;
}
});

最后，可以添加一些CSS樣式來美化圖片的顯示，例如添加邊框和陰影：

#imageContainer {
border: 1px solid #ccc;
box-shadow: 0px 0px 5px #ccc;
}

通過以上步驟，就可以使用jQuery Mobile輕松地將圖片嵌入到網(wǎng)頁中，并通過CSS樣式和JavaScript代碼來美化和調整圖片的大小和顯示效果。