首页 > 解决方案 > 离子cordova popover组件中的img不显示

问题描述

我希望当用户按下应用程序中的按钮时,会打开一个弹出窗口。此弹出窗口显示了几个圆形过滤器选项(不可见复选框前面的图片),这些选项在按下时会发生变化。像这样的东西:

过滤器选项的图片

问题是,我无法在 ionic cordova 的 popover 组件中看到 img,而 popover 元素可以正常工作。实际上可以在离子中做到这一点吗?

这是我的代码片段:

<div class="filter-buttons">
<div class="metal">
  <input type="checkbox">
  <label>test</label>
  <img src="heavy.jpg" alt="stuff" height="42" width="42"> 
</div>

我还尝试将它作为 CSS 中的背景:

.metal{
    background-image: url("heavy3.jpg");
}

标签: htmlimagecordovaionic-frameworkpopover

解决方案


您应该将图像放入www/assets 并添加此代码

background: url(../assets/heavy3.jpg) no-repeat;
background-size: 100% 100%;

推荐阅读