You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
66 lines
1.2 KiB
Vue
66 lines
1.2 KiB
Vue
7 months ago
|
<template>
|
||
|
|
<div>
|
||
|
|
<Carousel class="carousel"/>
|
||
|
|
<ProductCenter class="productCenter"/>
|
||
|
|
<ClassicCase class="classicCase"/>
|
||
|
|
<NewsCenter class="newsCenter"/>
|
||
|
|
<ContactUs class="contactUs"/>
|
||
|
|
<Copyright class="copyright"/>
|
||
|
|
</div>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script>
|
||
|
|
import Carousel from './carousel'
|
||
|
|
import ProductCenter from './productCenter'
|
||
|
|
import ClassicCase from './classicCase'
|
||
|
|
import NewsCenter from './newsCenter'
|
||
|
|
import ContactUs from './contactUs'
|
||
|
|
import Copyright from '@/components/copyright'
|
||
|
|
|
||
|
|
export default {
|
||
|
|
name: 'Index',
|
||
|
|
components: {
|
||
|
|
Carousel,
|
||
|
|
ProductCenter,
|
||
|
|
ClassicCase,
|
||
|
|
NewsCenter,
|
||
|
|
ContactUs,
|
||
|
|
Copyright
|
||
|
|
},
|
||
|
|
data() {
|
||
|
|
return {}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<style lang="less" scoped>
|
||
|
|
.carousel {
|
||
|
|
width: 100%;
|
||
|
|
height: 650px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.productCenter {
|
||
|
|
width: 100%;
|
||
|
|
}
|
||
|
|
|
||
|
|
.classicCase {
|
||
|
|
width: 100%;
|
||
|
|
background-image: linear-gradient(to top, rgba(255, 255, 255, 1), rgba(255, 255, 255, 0)), url("~@/assets/image/bg.jpg");
|
||
|
|
background-size: 100% 36.41vw;
|
||
|
|
background-repeat: no-repeat;
|
||
|
|
}
|
||
|
|
|
||
|
|
.newsCenter {
|
||
|
|
width: 100%;
|
||
|
|
}
|
||
|
|
|
||
|
|
.contactUs {
|
||
|
|
width: 100%;
|
||
|
|
background-color: #2e445c;
|
||
|
|
}
|
||
|
|
.copyright{
|
||
|
|
width: 100%;
|
||
|
|
background-color: #1d3348;
|
||
|
|
}
|
||
|
|
</style>
|