Ionic 2 - 向页面添加背景图像

Ionic 2 - Adding a background image to a page

我刚刚安装了一个新的 Ionic 项目 - Ionic v2.0.0-beta.32

我想在全新安装的主页上添加背景图片,有没有人可以告诉我该怎么做?我所能找到的只是 Ionic 1 的信息,而且情况似乎大不相同。

根据我的发现,图片需要具有以下尺寸

2800px x 2800px

但除此之外我找不到任何其他教程。

这是我的第一个 Ionic 项目所以要温柔

谢谢大家

图片大小不限。

转到app/theme/app.core.scss并添加以下代码

ion-content{
    background-image: url('img/background.jpg');
}

这是假设您的图像文件的名称是 background.jpg 并且存储在 www/img/ 文件夹中。

希望对您有所帮助

更新离子 3.x

转到app/app.scss并添加以下代码

ion-content {
    background-image: url('assets/img/background.jpg');
}

这是假设您的图像文件的名称是 background.jpg 并且存储在 assets/img 文件夹中。

在 ionic 2 中,只有将 img 文件夹放入 build 文件夹中,背景图像才有效。如果你去检查法师 url 它会告诉你我在 build/img/bg.jpg 中找到它尝试将文件夹 img 放入构建文件夹中。

www/build/img

对于 Ionic V4 他们在 scss 文件中使用了一些新的开关。这对我有用:

ion-content {
  --background: url('../../assets/Welcome-screen.png')  no-repeat 50% 10%;
}