Question

使用ng-style设置背景图片后，我似乎无法在css元素上应用样式。

HTML：

<body id="bg" ng-controller="BgImagesListController" ng-style="selBGImg">

CSS：

#bg {
    background: center center fixed transparent;
    -webkit-background-size: contain;
    -moz-background-size: contain;
    -o-background-size: contain;
    background-size:contain;
}

JS：

var mlwcApp = angular.module('mlwcApp', [])
.controller('BgImagesListController', function($scope, $http) {

    $scope.selBGImg = {
        background : 'url(bgimgs/bg.jpg)'
    };
});

我曾经在css中设置背景图片并且它有效。使用ng-style后，可以显示图像，但所有其他样式都消失了。有什么想法吗？

Answer 1

将背景更改为＆＃39; background-image＆＃39;：＆＃39; url（bgimgs / bg.jpg）＆＃39;

＆＃13;

var mlwcApp = angular.module('mlwcApp', [])
.controller('BgImagesListController', function($scope, $http) {
    $scope.selBGImg = {
        'background-image' : 'url(https://wiki.teamfortress.com/w/images/thumb/e/ec/Das_Naggenvatcher.png/250px-Das_Naggenvatcher.png)'
    };

})

＆＃13;

[id="bg"] {
    background: center center fixed transparent;
    -webkit-background-size: contain;
    -moz-background-size: contain;
    -o-background-size: contain;
    background-size:contain;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<body id="bg" ng-app="mlwcApp" ng-controller="BgImagesListController" ng-style="selBGImg">
    
</body>

＆＃13;

在angularjs中添加背景图像，css无法正常工作

1 个答案: