45 lines
848 B
Vue
45 lines
848 B
Vue
<template>
|
|
<div class="bg">
|
|
<div class="bg-middle"></div>
|
|
<div class="bg-up"></div>
|
|
<div class="bg-down"></div>
|
|
</div>
|
|
</template>
|
|
<style scoped>
|
|
.bg {
|
|
width: 100%;
|
|
padding-left: 15px;
|
|
position: absolute;
|
|
left: 0;
|
|
bottom: 38px;
|
|
height: 96px;
|
|
min-height: 96px;
|
|
}
|
|
|
|
.bg-up {
|
|
position: absolute;
|
|
top: 0;
|
|
height: 32px;
|
|
width: 300px;
|
|
background: url("@/assets/img/about/boder-top.svg") no-repeat;
|
|
background-size: 300px 32px ;
|
|
}
|
|
.bg-middle {
|
|
position: absolute;
|
|
top: 22px;
|
|
height: calc(100% - 22px);
|
|
width: 300px;
|
|
background: url("@/assets/img/about/boder-center.svg") repeat-y;
|
|
background-size: 300px 32px ;
|
|
}
|
|
|
|
.bg-down {
|
|
position: absolute;
|
|
bottom: 0;
|
|
height: 32px;
|
|
width: 300px;
|
|
background: url("@/assets/img/about/boder-bottom.svg") no-repeat;
|
|
background-size:300px 32px ;
|
|
}
|
|
</style>
|