18.菜单logo制作

本文主要是介绍18.菜单logo制作，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

菜单logo制作

1. 在项目assets里面加入logo

2. layout下新建MenuLogo.vue组件

MenuLofo.vue

<template><div class="logo"><img :src="MenuLogo" alt=""><span class="logo-title">{{  title  }}</span></div>
</template><script setup lang="ts">
import MenuLogo from '@/assets/logo.jpg'
import { ref } from 'vue';const title = ref('校园二手交易平台')
</script><style scoped lang="scss">
.logo{display: flex;width: 100%;height: 60px;line-height: 60px;background-color: rgb(255, 255, 255);align-items: center;img{width: 50px;height: 50px;}.logo-title{color: black;font-weight: 600;font-size: 22px;font-family: FangSong;}
}</style>

3. 效果图

这篇关于18.菜单logo制作的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！

---