更新shwopage
This commit is contained in:
parent
79a8673931
commit
665e27cd41
BIN
src/assets/座椅.png
Normal file
BIN
src/assets/座椅.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 365 KiB |
44
src/components/ShowPage.vue
Normal file
44
src/components/ShowPage.vue
Normal file
@ -0,0 +1,44 @@
|
|||||||
|
<template>
|
||||||
|
<v-container grid-list-lg class="bg-red" fluid>
|
||||||
|
<v-row fluid>
|
||||||
|
<v-col cols="8" class="bg-green" >
|
||||||
|
<v-spacer></v-spacer>
|
||||||
|
<div class="background-div">
|
||||||
|
|
||||||
|
<!-- 座椅调节按键 -->
|
||||||
|
<!-- 靠背 -->
|
||||||
|
<v-btn class="btn_zytj" icon style="left: 49%;top: 10px; ">
|
||||||
|
<v-icon size="300%">mdi-arrow-left-bold-outline</v-icon>
|
||||||
|
</v-btn>
|
||||||
|
<v-btn class="btn_zytj" icon style="left: 68%;top: 10px; ">
|
||||||
|
<v-icon size="300%">mdi-arrow-right-bold-outline</v-icon>
|
||||||
|
</v-btn>
|
||||||
|
<!-- 滑轨 -->
|
||||||
|
<v-btn class="btn_zytj" icon style="left: 5%;top: 380px;">
|
||||||
|
<v-icon size="300%">mdi-arrow-left-bold-outline</v-icon>
|
||||||
|
</v-btn>
|
||||||
|
</div>
|
||||||
|
</v-col>
|
||||||
|
<v-col cols="4" class="bg-yellow">
|
||||||
|
|
||||||
|
</v-col>
|
||||||
|
</v-row>
|
||||||
|
</v-container>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<style>
|
||||||
|
.background-div {
|
||||||
|
background-image: url("..\assets\座椅.png");
|
||||||
|
background-size: contain; /* 调整图片大小以适应容器 */
|
||||||
|
background-position: center; /* 调整图片位置 */
|
||||||
|
height: 500px ; /* 设置容器高度 */
|
||||||
|
z-index: -1;
|
||||||
|
/* 设置框线 */
|
||||||
|
border: 2px solid #000; /* 边框颜色和宽度 */
|
||||||
|
/* 让 div 不会因为内容撑开宽度,仅由背景图片决定 */
|
||||||
|
}
|
||||||
|
.btn_zytj {
|
||||||
|
width: 60px;
|
||||||
|
height: 60px;
|
||||||
|
}
|
||||||
|
</style>
|
Loading…
x
Reference in New Issue
Block a user