jQuery Mobile 是一款非常流行的前端框架,其中圖片居中是一個常見需求。本文將介紹幾種方法,讓你輕松實現圖片居中。
方法一:使用CSS的text-align屬性。
img {
display: block;
margin: 0 auto;
}
方法二:使用jQuery Mobile中的“text-center”類。
<div class="ui-grid-b">
<div class="ui-block-a"></div>
<div class="ui-block-b"><img src="your-image.jpg" class="ui-centered-image"></div>
<div class="ui-block-c"></div>
</div>
.ui-centered-image {
display: block;
margin-left: auto;
margin-right: auto;
}
方法三:使用jQuery插件Centerify。
<script src="jquery.centerify.js"></script>
<script>
$(document).ready(function() {
$('img').centerify();
});
</script>
以上就是幾種常用的圖片居中方法,你可以根據自己的需求選擇其中一種進行使用。希望本文能夠對你有所幫助。