html - 为背景图像速记正确格式化 ng-style

标签 html css angular sprite-sheet ng-style

下面一行有些不对劲。我的高度和宽度正确显示在我的应用程序中。如果我包含 + character.offsetX + 'px' + character.offsetY + 'px' 背景图像样式不会出现。

Character.offsetX 和 offsetY 是字符对象提供的硬编码数字。

我在网上找到的示例非常简单,没有显示如何使用 background-image 的简写版本来设置 background-position

<li *ngFor="let character of this.characterList" [ngStyle]= "{'height':'50px', 'width':'50px', 'background-image':'url(' + character.fullImagePath + ')' + character.offsetX + 'px' + character.offsetY + 'px' }"

最佳答案

background-image 不允许设置其他 background-* 属性 - 您需要使用 background代替它的简写:

<li *ngFor="let character of this.characterList" [ngStyle]= "{'height':'50px', 'width':'50px', 'background':'url(' + character.fullImagePath + ') ' + character.offsetX + 'px ' + character.offsetY + 'px' }"

关于html - 为背景图像速记正确格式化 ng-style,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/56572613/

相关文章:

angular - stepMinute 在 PrimeNG 的日历中不起作用

javascript - 如何检查我的复选框列表是否已选中或未选中 AngularJS 2

java - 热部署 HTML 模板会在汉字位置生成问号 - 仅在 CentOS 上

html - css 布局、div 定位、对齐和 z-index 的问题

javascript - 如何在浏览器的警告框上显示大文本并防止文本被剪裁?

css - 通用树数据结构可视化编辑器

javascript - 我应该如何在使用 AngularJS 构建的整个网站中设置字体 'bariol Regular'?

html - CSS 将包装器对齐到屏幕的顶部和底部

javascript - Angular Router 元素中的 CSS Center 元素

javascript - Angular 2 表折叠在排序时无法正常工作