Windows商店应用程序 - 项目背景颜色' s

时间:2013-04-19 09:11:52

标签: javascript html css windows-runtime windows-store-apps

我无法在分割应用程序中更改项目的背景颜色。我不知道,因为我已经尝试过使用CSS而且没有任何成功。

这是项目的模板(几乎默认):

<div class="itemtemplate" data-win-control="WinJS.Binding.Template">
    <div class="item">
        <img class="item-image" src="#" data-win-bind="src: backgroundImage; alt: title" />
        <div class="item-info">
            <h3 class="item-title win-type-ellipsis" data-win-bind="textContent: title"></h3>
            <h6 class="item-subtitle win-type-ellipsis" data-win-bind="textContent: subtitle"></h6>
            <h4 class="item-description" data-win-bind="textContent: description"></h4>
        </div>
    </div>
</div>

Css尝试:

.item {
    background-color: red;
}

这就是它的样子: enter image description here

另外,我希望将这种紫罗兰色和紫色周围的浅灰色(悬停?)变成其他东西。

1 个答案:

答案 0 :(得分:1)

关于改变紫罗兰色的第二个问题:

您是否将模板用于ListView?我在我的应用程序中使用它来覆盖默认的CSS。 注意:这将更改应用程序中的所有ListView。

.win-selectionhint,
.win-listview:not(.win-selectionstylefilled) .win-container.win-selected:hover .win-selectionborder,
.win-listview:not(.win-selectionstylefilled) .win-selectioncheckmarkbackground,
.win-listview:not(.win-selectionstylefilled) .win-container.win-selected:hover .win-selectioncheckmarkbackground,
.win-listview.win-rtl:not(.win-selectionstylefilled) .win-container.win-selected:hover .win-selectioncheckmarkbackground,
.win-listview.win-rtl:not(.win-selectionstylefilled) .win-selectioncheckmarkbackground,
:not(.win-selectionstylefilled).win-listview .win-selectioncheckmarkbackground,
:not(.win-selectionstylefilled).win-listview .win-selected.win-container .win-selectionborder {
   border-color: transparent; /* <----- COLOR HERE. */
}

这将删除所选列表项周围的颜色,并删除所选项目上的悬停颜色。