130 lines
3.7 KiB
Vue
130 lines
3.7 KiB
Vue
<template>
|
||
<!-- PC端布局 -->
|
||
<div class="group_30 flex-col pc-footer">
|
||
<div class="text-wrapper_13 flex-row">
|
||
<span class="text_67">企业首页</span>
|
||
<span class="text_68">产品 &服务</span>
|
||
<span class="text_69">灵睿 &我们</span>
|
||
<span class="text_70">客户&评价</span>
|
||
<span class="text_71">社会&责任</span>
|
||
<span class="text_72">联系我们</span>
|
||
<span class="text_73">联系电话：400-080-0379</span>
|
||
</div>
|
||
<div class="group_31 flex-col"></div>
|
||
<div class="group_32 flex-row">
|
||
<div class="text-wrapper_14 flex-col">
|
||
<span class="text_74">
|
||
洛阳灵睿网络技术有限公司|洛阳网络公司|洛阳网络推广|洛阳易站通总代理|洛阳微客红包|洛阳微信营销
|
||
</span>
|
||
<span class="text_75">法律顾问：河南森合律师事务机构</span>
|
||
<span class="text_76">
|
||
©2021 洛阳灵睿网络技术有限公司 All rights reserved.豫ICP备15023627号-3
|
||
</span>
|
||
<span class="text_77">
|
||
洛阳公司地址：洛阳市 洛龙区 世贸中心D座1816室
|
||
</span>
|
||
</div>
|
||
<img class="image_29" referrerpolicy="no-referrer"
|
||
src="public/images/wb.png" />
|
||
<img class="image_30" referrerpolicy="no-referrer"
|
||
src="public/images/wx.png" />
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 移动端布局 -->
|
||
<div class="mobile-footer flex-col">
|
||
<div class="mobile-nav flex-col">
|
||
<span class="mobile-nav-item">企业首页</span>
|
||
<span class="mobile-nav-item">产品&服务</span>
|
||
<span class="mobile-nav-item">灵睿&我们</span>
|
||
<span class="mobile-nav-item">客户&评价</span>
|
||
<span class="mobile-nav-item">社会&责任</span>
|
||
<span class="mobile-nav-item">联系我们</span>
|
||
<span class="mobile-contact">联系电话：400-080-0379</span>
|
||
</div>
|
||
<div class="mobile-info flex-col">
|
||
<span class="mobile-company">洛阳灵睿网络技术有限公司</span>
|
||
<span class="mobile-legal">法律顾问：河南森合律师事务机构</span>
|
||
<span class="mobile-copyright">©2021 洛阳灵睿网络技术有限公司 All rights reserved.</span>
|
||
<span class="mobile-icp">豫ICP备15023627号-3</span>
|
||
<span class="mobile-address">洛阳公司地址：洛阳市 洛龙区 世贸中心D座1816室</span>
|
||
</div>
|
||
<div class="mobile-social flex-row">
|
||
<img class="mobile-social-icon" referrerpolicy="no-referrer" src="public/images/wb.png" />
|
||
<img class="mobile-social-icon" referrerpolicy="no-referrer" src="public/images/wx.png" />
|
||
</div>
|
||
</div>
|
||
</template>
|
||
|
||
<script lang="ts" setup>
|
||
</script>
|
||
|
||
<style lang="scss" scoped>
|
||
@import '@/assets/index.css';
|
||
|
||
/* PC端默认样式保持不变 */
|
||
.mobile-footer {
|
||
display: none;
|
||
}
|
||
|
||
/* 移动端样式 */
|
||
@media screen and (max-width: 768px) {
|
||
.pc-footer {
|
||
display: none;
|
||
}
|
||
|
||
.mobile-footer {
|
||
display: flex;
|
||
padding: 20px;
|
||
background-color: #f8f8f8;
|
||
width: 100%;
|
||
}
|
||
|
||
.mobile-nav {
|
||
gap: 15px;
|
||
margin-bottom: 20px;
|
||
text-align: center;
|
||
}
|
||
|
||
.mobile-nav-item {
|
||
font-size: 14px;
|
||
color: #333;
|
||
}
|
||
|
||
.mobile-contact {
|
||
font-size: 14px;
|
||
color: #666;
|
||
margin-top: 10px;
|
||
}
|
||
|
||
.mobile-info {
|
||
gap: 10px;
|
||
text-align: center;
|
||
margin-bottom: 20px;
|
||
}
|
||
|
||
.mobile-company {
|
||
font-size: 14px;
|
||
color: #333;
|
||
}
|
||
|
||
.mobile-legal,
|
||
.mobile-copyright,
|
||
.mobile-icp,
|
||
.mobile-address {
|
||
font-size: 12px;
|
||
color: #666;
|
||
}
|
||
|
||
.mobile-social {
|
||
justify-content: center;
|
||
gap: 20px;
|
||
}
|
||
|
||
.mobile-social-icon {
|
||
width: 24px;
|
||
height: 24px;
|
||
}
|
||
}
|
||
</style>
|