我正在使用Grip 应用程序模板,并且我进行了一些更改,例如因为我无法在groupedItems.html中添加 Id :
<div class="itemtemplate" data-win-control="WinJS.Binding.Template">
<div id="item" data-win-bind="className: importancia">
<img class="item-image" src="#" data-win-bind="src: backgroundImage; alt: title" />
<div class="item-overlay">
<h4 class="item-title" data-win-bind="textContent: title"></h4>
<h6 class="item-subtitle win-type-ellipsis" data-win-bind="textContent: subtitle"></h6>
</div>
</div>
</div>
在CSS中,我对groupedItems.css进行了所有更改,例如:
.groupeditemspage .groupeditemslist #item {
-ms-grid-columns: 1fr;
-ms-grid-rows: 1fr 90px;
display: -ms-grid;
height: 250px;
width: 250px;
}
并且作为data.js中的常规模板效果很好,我添加了一个新选项:
var sampleItems = [
{ group: sampleGroups[0], importancia: "alta", title: "Item Title: 1", subtitle: "Item Subtitle: 1", description: itemDescription, content: itemContent, backgroundImage: lightGray },
{ group: sampleGroups[0], title: "Item Title: 2", subtitle: "Item Subtitle: 2", description: itemDescription, content: itemContent, backgroundImage: darkGray },
{ group: sampleGroups[0], title: "Item Title: 3", subtitle: "Item Subtitle: 3", description: itemDescription, content: itemContent, backgroundImage: mediumGray },
{ group: sampleGroups[0], title: "Item Title: 4", subtitle: "Item Subtitle: 4", description: itemDescription, content: itemContent, backgroundImage: darkGray },
{ group: sampleGroups[0], title: "Item Title: 5", subtitle: "Item Subtitle: 5", description: itemDescription, content: itemContent, backgroundImage: mediumGray }];
我想改变一个项目的宽度,我在头部添加了这段代码:
<style type="text/css">
.alta {
width: 510px;
}
</style>
我不知道为什么不起作用,它什么也没做。我需要改变什么?