ソースを参照

add 上下分段的背景图

tags/AL.0.8.0_20240113_base
yuan 1年前
コミット
6f6b5ca559
5個のファイルの変更13行の追加0行の削除
  1. バイナリ
      src/components/background-basic/background-lower.jpg
  2. バイナリ
      src/components/background-basic/background-upper.jpg
  3. +3
    -0
      src/components/background-basic/index.json
  4. +0
    -0
      src/components/background-basic/index.scss
  5. +10
    -0
      src/components/background-basic/index.vue

バイナリ
src/components/background-basic/background-lower.jpg ファイルの表示

変更前 変更後
幅: 1080  |  高さ: 960  |  サイズ: 110 KiB

バイナリ
src/components/background-basic/background-upper.jpg ファイルの表示

変更前 変更後
幅: 1080  |  高さ: 960  |  サイズ: 76 KiB

+ 3
- 0
src/components/background-basic/index.json ファイルの表示

@@ -0,0 +1,3 @@
{
"component": true
}

+ 0
- 0
src/components/background-basic/index.scss ファイルの表示


+ 10
- 0
src/components/background-basic/index.vue ファイルの表示

@@ -0,0 +1,10 @@
<template>
<View style="top: 0; bottom: 0; z-index: -1020">
<View style="z-index: -1010; top: 0" className='position-absolute'>
<Image :src="require('./background-upper.jpg')" mode='widthFix' style="width: 100vw"/>
</View>
<View style="z-index: -1010; bottom: 0" className='position-absolute d-flex justify-content-end'>
<Image :src="require('./background-lower.jpg')" mode='aspectFill' style="width: 100vw"/>
</View>
</View>
</template>

読み込み中…
キャンセル
保存