我正在使用
JQuery Mobile listview创建带缩略图的项目列表.
如何设置Listviews中使用的缩略图图像的对齐方式?
我尝试使用align,vertical-align或甚至用< center>包装图像来设置图像的样式属性.标签,但它不起作用.
我也尝试过margin-top但是这不起作用,因为不管它的高度如何都会向下推动所有的拇指.我只想垂直和放大水平居中的图像小于80 x 80像素.
我想将图像水平和垂直对齐到中心.
解决方法
JQuery mobile将以下样式应用于您的ui-li-icon:
.ui-li-icon { position: absolute; left: 1px; top: 0; max-height: 80px; max-width: 80px; }
要不破坏现有实现,可以将图标图像包装在另一个标记中,例如:
<li> <a href="#p1"> <p class="my_icon_wrapper"> <img src="images/myicon_image." width="32" height="32"/> </p> <h3>List item title</h3> <p>List item description</p> </a> </li>
my_icon_wrapper可以实现jQuery Mobile所做的一些样式,例如:
.my_icon_wrapper { float: left; width: 80px; height: 80px; text-align: center; vertical-align: middle; }
您需要稍微使用这些样式才能获得所需的效果.