code/src/components/footView.vue
2025-04-03 16:10:19 +08:00

138 lines
2.5 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<template>
<div class="foot">
<div class="foot-box">
<div class="foot-1">
<div class="logo">
<img class="img" :src="imagePath.logo" alt="logo" />
<span class="sys-title-bt" title="辉擎科技">辉擎科技</span>
</div>
<div class="wb">致力于为企业提供专业的数字化转型解决方案助力企业实现智能化升级</div>
</div>
<div class="foot-2">
<span>解决方案</span>
<span> <a href="#">智慧办公</a></span>
<span><a href="#">智能制造</a> </span>
<span><a href="#">数据智能</a></span>
<span><a href="#">云服务</a></span>
</div>
<div class="foot-2">
<span>关于我们</span>
<span><a href="#">公司简介</a></span>
<span><a href="#">发展历程</a></span>
<span><a href="#">企业文化</a></span>
<span><a href="#">联系我们</a></span>
</div>
<div class="foot-2">
<span>联系我们</span>
<span>电话:400-888-8888</span>
<span>邮箱:huiqing@huiqing-cd.com</span>
<span>地址四川成都</span>
</div>
</div>
<hr />
<div class="foot-w">@2024 Company All rights reserved</div>
</div>
</template>
<script>
import logo from '@/assets/images/logo.png'
export default {
data() {
return {
imagePath: {
logo,
},
}
},
}
</script>
<style scoped>
.sys-title-bt {
font-size: 2vw;
font-weight: 600;
cursor: default;
z-index: 1;
position: relative;
top: -21px;
left: 15px;
color: #e7e5e5;
letter-spacing: 3px;
}
.wb {
letter-spacing: 1.5px;
line-height: 1.6;
margin-bottom: 10px;
}
hr {
border: 0;
height: 2px;
background-color: #333;
margin-bottom: 20px;
}
.foot-w {
color: #858484;
text-align: center;
}
.foot {
height: 400px;
background-color: #2e2e2e;
}
a {
text-decoration: none;
color: inherit;
}
.img {
width: 70px;
height: 70px;
}
.img-logo {
font-size: 20px;
color: #fff;
}
.foot-box {
width: 100%;
min-height: 200px;
background-color: #2e2e2e;
display: flex;
justify-content: space-around;
padding: 70px 0;
}
.foot-1 {
display: flex;
flex-direction: column;
justify-content: space-around;
}
.foot-1 div:nth-child(2) {
color: #858484;
width: 300px;
}
.foot-2 {
display: flex;
flex-direction: column;
justify-content: space-around;
color: #858484;
}
.foot-2 span:nth-child(1) {
font-size: 20px;
color: #fff;
}
</style>