如何改变离子中的背景图像?

时间:2015-11-03 07:22:49

标签: html css ionic

我想在离子中设置背景图像。这是我的code.it不工作。这里样式表不起作用。什么时候我应该添加样式表?我不知道如何找到错误。

<ion-side-menus enable-menu-with-back-views="false" style="background: url('../img/background.jpg');background-size: 100% 100%;background-repeat: no-repeat;color: #EF4836;">
    <ion-side-menu-content>
        <ion-nav-bar class="bar bar-header ionBarM " align-title="center">
            <ion-nav-back-button style="color: white">
            </ion-nav-back-button>
            <ion-nav-buttons side="right">
                <button class="button button-icon button-clear button-light ion-navicon custom-icon" menu-toggle="right" style=" color: white;">
                </button>
            </ion-nav-buttons>
        </ion-nav-bar>
        <div class="bar bar-subheader ionSubBar ">
            <div class="button-bar">
            </div>
        </div>
        <ion-content class="has-subheader" style="background: url('../img/background.jpg');background-size: 100% 100%;background-repeat: no-repeat;color: #EF4836;">
            <ion-refresher .... </ion-refresher>
                <ion-list>
                    <div class="list list-inset" data-ng-repeat="announcement in announcements">
                        <a class="item item-thumbnail-left" ui-sref="app.shop({id:announcement.id})" ng-click="showshop({{$index}})">
            ......
        </a>
                    </div>
                </ion-list>
        </ion-content>
</ion-side-menus>

1 个答案:

答案 0 :(得分:2)

这样做,

Style.css

 /*Back Ground image For App*/

 ion-view {
     background-image:url("../img/background.jpg") !important;
     background-repeat:no-repeat;
     background-size:cover;
     overflow:hidden;
 }