Question

我正在将jQuery Mobile与列表视图缩略图集成，但它会将我的图像调整为固定宽度。改变.ui-li-thumb宽度没有帮助。如何让我的拇指更宽？

Answer 1

试试这个并加入“，.ui-li-icon”！

.ui-li-thumb, .ui-li-icon {
    left: 1px;
    max-height: 60px; 
    max-width: 60px;
    position: absolute;
    top: 0;
}

这会影响缩略图尺寸为60 * 60px ..在我的情况下适用于各种尺寸。

如果这不起作用，请提供一些代码以查看错误（HTML，JS，CSS）。

Answer 2

我想让listview中的缩略图变小。这就是我使用jQuery Mobile版本1.4.2执行此操作的方法：

.ui-listview .ui-li-has-thumb > img:first-child,
.ui-listview .ui-li-has-thumb > .ui-btn > img:first-child,
.ui-listview .ui-li-has-thumb .ui-li-thumb {
    left: 1px;
    top: 1px;
    max-height: 40px;
    max-width: 40px;
}
.ui-listview > .ui-li-has-thumb > .ui-btn,
.ui-listview > .ui-li-static.ui-li-has-thumb {
    min-height: 0;
    padding: .7em 1em .7em 55px;
}

我在上面定义的顶部，左侧和底部填充只是为了将这些填充值恢复为ui-btn的默认值。图像绝对位于listview项目中，因此如果要使图像更大，则必须通过增加上面显示的min-height css属性来补偿图像。

Answer 3

对我来说，这个解决方案在列表中运行正常。它还可以调整拇指内部文本的填充。

.ui-listview .ui-li-icon{
    max-height: 32px; 
    max-width: 32px;
}
.ui-li-static.ui-li-has-icon{
    padding-left:50px;
}

对于将.ui-li-icon类应用于图像

的情况

jQuery Mobile，列表视图缩略图大小

3 个答案: