在使用 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 后,图像可以显示,但所有其他样式都消失了。有什么想法吗?
最佳答案
将背景更改为'background-image':'url(bgimgs/bg.jpg)'
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)'
};
})
[id="bg"] {
background: center center fixed transparent;
-webkit-background-size: contain;
-moz-background-size: contain;
-o-background-size: contain;
background-size:contain;
}
<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>
关于javascript - 在angularjs中添加背景图片,css不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/32968835/