web-dev-qa-db-ja.com

Ionic 2-ページに背景画像を追加する

新しいIonicプロジェクト-Ionic v2.0.0-beta.32

フレッシュインストールのホームページに背景画像を追加しようとしていますが、これをどのように行うかを教えてくれる人はいますか？私が見つけることができるのはIonic 1の情報であり、物事はかなり異なっているようです。

Iveが見つけたものから、画像は次の寸法である必要があります

2800px x 2800px

しかし、それとは別に、他のチュートリアルを見つけることはできません。

これは私の最初のIonicプロジェクトなので、優しくしてください

どうもありがとう

ionic-frameworkionic2
9
BigJobbies

画像のサイズは任意です。

app/theme/app.core.scssに移動して、次のコードを追加します

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

これは、画像ファイルの名前がbackground.jpgであり、www/img/フォルダーに保存されていることを前提としています。

お役に立てれば

更新Ionic 3.x

app/app.scssに移動し、次のコードを追加します

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

これは、画像ファイルの名前がbackground.jpgであり、assets/imgフォルダーに保存されていることを前提としています。

23
Raymond Ativie

Ionic V4の場合、scssファイルで新しいスイッチを使用します。これは私のために働いた：

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