lxm_front/AJ-Report
1
0
Fork 0
mirror of https://gitee.com/anji-plus/report.git synced 2026-03-20 09:38:35 +08:00
Code Issues Projects Releases Wiki Activity

首页背景色修改

Browse Source
This commit is contained in:
木子李·De
2021-07-09 12:56:04 +08:00
parent 3ae26bd577
commit ac7b9d64d2
1 changed files with 41 additions and 31 deletions
Download Patch File Download Diff File Expand all files Collapse all files

72
report-ui/src/views/home/index.vue
View File

@@ -1,9 +1,9 @@
<template>
<div class="index-container">
<div class="left-top"></div>
<!-- <div class="left-top"></div>
<div class="left-bottom"></div>
<div class="right-top"></div>
<div class="right-bottom"></div>
<div class="right-bottom"></div> -->
<el-row align="middle" justify="center">
<el-col :span="24" :offset="0" class="position">
<div class="center"></div>
@@ -13,86 +13,96 @@
</template>
<script>
export default {
name: 'index1',
data() {
return {
}
return {}
},
components:{},
components: {},
watch: {},
mounted() {},
methods: {
}
methods: {},
}
</script>
<style rel="stylesheet/scss" lang="scss">
.index-container{
.index-container {
width: 100%;
height:calc(100vh - 50px);
height: calc(100vh - 50px);
overflow: hidden;
background:#fff;
background: -webkit-linear-gradient(75deg, #3d37b5 , #5bc4ef); /* Safari 5.1 - 6.0 */
background: -o-linear-gradient(75deg, #3d37b5, #5bc4ef); /* Opera 11.1 - 12.0 */
background: -moz-linear-gradient(75deg, #3d37b5, #5bc4ef); /* Firefox 3.6 - 15 */
background: linear-gradient(75deg,#3d37b5, #5bc4ef);
.position{
background: #fff;
background: -webkit-linear-gradient(
75deg,
#e9f0fb,
#5bc4ef
); /* Safari 5.1 - 6.0 */
background: -o-linear-gradient(
75deg,
#e9f0fb,
#5bc4ef
); /* Opera 11.1 - 12.0 */
background: -moz-linear-gradient(
75deg,
#e9f0fb,
#5bc4ef
); /* Firefox 3.6 - 15 */
background: linear-gradient(75deg, #e9f0fb, #e9f0fb);
.position {
padding-left: 10px;
padding-right: 10px;
margin-bottom: 0;
position: absolute;
top: 67px;
}
.left-top,.left-bottom,.right-top,.right-bottom{
position:absolute;
.left-top,
.left-bottom,
.right-top,
.right-bottom {
position: absolute;
}
.left-top{
.left-top {
left: 0;
top: 0;
z-index: 1;
width: 223px;
height: 291px;
background: url("../../../static/index-top-left.png");
background: url('../../../static/index-top-left.png');
background-size: 100% 100%;
}
.left-bottom{
.left-bottom {
left: 0;
bottom: 0;
z-index: 2;
width: 461px;
height: 236px;
background: url("../../../static/index-bottom-left.png");
background: url('../../../static/index-bottom-left.png');
background-size: 100% 100%;
}
.right-top{
.right-top {
right: 0;
top: 0;
z-index: 31;
width: 346px;
height: 309px;
background: url("../../../static/index-top-right.png");
background: url('../../../static/index-top-right.png');
background-size: 100% 100%;
}
.right-bottom{
.right-bottom {
right: 0;
bottom: 0;
z-index: 4;
width: 463px;
height: 320px;
background: url("../../../static/index-bottom-right.png");
background: url('../../../static/index-bottom-right.png');
background-size: 100% 100%;
}
.center{
.center {
width: 100%;
height: 93vh;
bottom: 0;
position:relative;
position: relative;
max-width: 1893px;
background: url("../../../static/index-center.png");
background: url('../../../static/index-center.png');
background-size: 100% 100%;
}
}