Question

Listview有一个数据插入属性，可以使其四舍五入。但是，我不能使用listview，因为我的列表是一个嵌套列表，框架的默认行为是隐藏嵌套列表，并在单击其主列表后显示它。所以，我选择在主listview行中使用ui-grid视图，如下所示：

<ul data-role="listview">
<li><h1 class="ui-title" role="heading" aria-level="1">Completeness</h1></li>
<li>
<div class="ui-grid-b">
<div>Secondary Title</div>
<div>Content.....</div>
<div>Blah Blah</div>
</div
</li>
<li>Footer</li>
</ul>

我的问题是ui-grid的角应圆润。我试图把data-inset =“true”但是没有用。

Answer 1

您可以使用jQuery Mobile添加到窗口小部件的类，在这种情况下，您正在寻找在所有四个角上放置角的ui-corner-all类，然后您可能需要{{1 } box-shadow适用：

ui-shadow

我添加了填充，因为默认情况下网格元素没有任何填充。此外，<div class="ui-grid-b ui-corner-all ui-shadow" style="padding: 5px;">和ui-corner-top类仅围绕应用它们的元素的顶部/底部。

以下是演示：http://jsfiddle.net/VXrxv/

如果您希望将ui-corner-bottom元素作为li元素的父元素进行舍入，则可以向其添加ui-grid：

margin

以下是演示：http://jsfiddle.net/VXrxv/1/

Answer 2

尝试使用css属性border-radius。例如，尝试border-radius: 0.5em 0.5em;

Answer 3

在Bootstrap上进行舍入;

这对我来说似乎是最快的解决方案;

使用以下div包装雾小部件

<div class="k-block" style="padding:0px">

如何让ui-grid的角落圆润？

3 个答案: