画像を設定する前のアプリ画面
はじめに
Ionicで画像を設定する方法について
バージョン情報
Ionic: 3.9.2
Angular: 5.0.3
node: 8.1.4
macOS High Sierra
画像設定方法
設定したい画像(例では、isometropolis.jpg
)をsrc/assets/imgs
配下に置く。
CSS(SCSS)から画像を参照する場合
CSSからは、パスを../assets/imgs/[画像ファイル名称]
に設定すると画像を参照できる。
src/pages/home/home.scss
page-home { background-image: url(../assets/imgs/isometropolis.jpg) }
HTMLから画像を参照する場合
HTMLからは、パスをassets/imgs/[画像ファイル名称]
に設定すると画像を参照できる。
src/pages/home/home.html
:
<img id="bird" src="assets/imgs/bird.png">
画像を設定した後のアプリ画面