parent
8b7dd30adb
commit
5fd3df9095
After Width: | Height: | Size: 189 KiB |
After Width: | Height: | Size: 8.7 KiB |
@ -1,39 +1,145 @@ |
|||||||
<template> |
<template> |
||||||
<div> |
<el-container> |
||||||
<div style="margin: 10px 0 10px 0 ;position:absolute;right:20px;top:auto;"> |
<el-header class="header"> |
||||||
<!-- <el-button round icon="el-icon-star-off" @click="$router.push({name:'FirLogin'})"></el-button>--> |
<el-row :gutter="12"> |
||||||
<el-button round icon="el-icon-apple" @click="$router.push({name:'FirApps'})"></el-button> |
<el-col :span="12"> |
||||||
|
<el-image class="logo img" :src="require('@/assets/logo.png')" alt="logo"/> |
||||||
|
</el-col> |
||||||
|
<el-col :span="12" :offset="12"> |
||||||
|
<el-row :gutter="12" class="nav"> |
||||||
|
<el-col :span="8"> |
||||||
|
<el-link>工具</el-link> |
||||||
|
</el-col> |
||||||
|
<el-col :span="8"> |
||||||
|
<el-link @click="$router.push({name:'FirApps'})">登陆</el-link> |
||||||
|
</el-col> |
||||||
|
<el-col :span="8"> |
||||||
|
<el-link @click="$router.push({name:'FirRegist'})">注册</el-link> |
||||||
|
</el-col> |
||||||
|
</el-row> |
||||||
|
</el-col> |
||||||
|
</el-row> |
||||||
|
|
||||||
|
</el-header> |
||||||
|
<div> |
||||||
|
<div class="main"> |
||||||
|
<div class="top"> |
||||||
|
<img :src="require('@/assets/bg.jpeg')" alt="topimg"> |
||||||
</div> |
</div> |
||||||
|
<div class="topplayer-top"> |
||||||
<div class="firplane"> |
<div class="word">FLY 应用 分发平台</div> |
||||||
<img src="../assets/plane.svg"> |
<el-button @click="$router.push({name:'FirApps'})">开始分发 ></el-button> |
||||||
<div style="margin-top: -195px;margin-left: 107px"> |
|
||||||
<img src="../assets/propeller.svg"> |
|
||||||
</div> |
</div> |
||||||
</div> |
</div> |
||||||
</div> |
</div> |
||||||
|
|
||||||
|
<el-footer> |
||||||
|
<el-divider/> |
||||||
|
<FirFooter></FirFooter> |
||||||
|
</el-footer> |
||||||
|
</el-container> |
||||||
</template> |
</template> |
||||||
|
|
||||||
<script> |
<script> |
||||||
|
import FirFooter from "@/components/FirFooter"; |
||||||
|
|
||||||
export default { |
export default { |
||||||
name: "FirIndex", |
name: "FirIndex", |
||||||
data() { |
components: {FirFooter}, |
||||||
return {} |
|
||||||
}, |
|
||||||
created() { |
|
||||||
} |
|
||||||
} |
} |
||||||
</script> |
</script> |
||||||
|
|
||||||
<style scoped> |
<style scoped> |
||||||
|
* { |
||||||
|
margin: 0; |
||||||
|
padding: 0; |
||||||
|
} |
||||||
|
|
||||||
|
.header { |
||||||
|
width: 100%; |
||||||
|
height: 120px; |
||||||
|
} |
||||||
|
|
||||||
|
.header .img { |
||||||
|
width: 300px; |
||||||
|
height: 85px; |
||||||
|
padding-left: 100px; |
||||||
|
padding-top: 8px; |
||||||
|
} |
||||||
|
|
||||||
|
.header .logo { |
||||||
|
float: left; |
||||||
|
} |
||||||
|
|
||||||
|
.header .nav { |
||||||
|
float: right; |
||||||
|
padding-right: 80px; |
||||||
|
|
||||||
|
} |
||||||
|
|
||||||
|
.header .nav .el-col { |
||||||
|
margin-right: 20px; |
||||||
|
float: left; |
||||||
|
list-style: none; |
||||||
|
width: 80px; |
||||||
|
height: 60px; |
||||||
|
line-height: 100px; |
||||||
|
color: #7d7d7d; |
||||||
|
font-size: 15px; |
||||||
|
font-weight: bolder; |
||||||
|
} |
||||||
|
|
||||||
|
.header .nav .el-link:hover { |
||||||
|
color: #47477d; |
||||||
|
font-size: 16px; |
||||||
|
cursor: pointer; |
||||||
|
touch-action: manipulation; |
||||||
|
|
||||||
|
} |
||||||
|
|
||||||
|
.main .top { |
||||||
|
margin-top: 60px; |
||||||
|
width: 100%; |
||||||
|
height: 700px; |
||||||
|
} |
||||||
|
|
||||||
|
.main .top img { |
||||||
|
width: 100%; |
||||||
|
height: 700px; |
||||||
|
} |
||||||
|
|
||||||
.firplane { |
.main .topplayer-top { |
||||||
|
width: 500px; |
||||||
|
height: 300px; |
||||||
position: absolute; |
position: absolute; |
||||||
left: 50%; |
top: 400px; |
||||||
top: 50%; |
margin-top: -150px; |
||||||
transform: translate(-50%, -50%); |
z-index: 2; |
||||||
|
right: 50%; |
||||||
|
margin-right: -250px; |
||||||
|
} |
||||||
|
|
||||||
|
.main .topplayer-top .word { |
||||||
|
padding-top: 100px; |
||||||
|
color: #ffffff; |
||||||
|
font-size: 45px; |
||||||
|
font-weight: bolder; |
||||||
|
text-align: center; |
||||||
|
font-family: "微软雅黑"; |
||||||
|
} |
||||||
|
|
||||||
|
.main .topplayer-top button { |
||||||
|
width: 200px; |
||||||
|
height: 60px; |
||||||
|
margin-top: 50px; |
||||||
|
color: #ffffff; |
||||||
|
background: #f5704f; |
||||||
|
font-family: 微软雅黑; |
||||||
|
text-align: center; |
||||||
|
font-weight: bolder; |
||||||
|
font-size: 14px; |
||||||
|
border-radius: 8px; /*圆角*/ |
||||||
|
margin-left: 150px; |
||||||
} |
} |
||||||
|
|
||||||
</style> |
</style> |
Loading…
Reference in new issue