写一些vue app 常用的全局样式

Vue.js 应用程序中，全局样式通常会放在单独的一个文件（如`main.css`、`global.scss` 或 `styles.css`）中，以便在整个应用中共享。以下是一些常见的全局样式示例：

1. **基础样式**：

   * {
     margin: 0;
     padding: 0;
     box-sizing: border-box;
   }
   
   body {
     font-family: Arial, sans-serif;
     background-color: #f5f5f5;
   }

   a {
     color: blue;
     text-decoration: none;
   }

2. **响应式设计**：

   @media (max-width: 768px) {
     .container {
       width: 90%;
     }
   }

3. **导航栏通用样式**：

   nav {
     display: flex;
     justify-content: space-between;
     padding: 1rem;
   }

4. **组件样式封装**：
如果有常用的组件样式，例如按钮或卡片，可以创建CSS模块并导出：

   .btn {
     display: inline-block;
     padding: 0.5rem 1rem;
     background-color: #007BFF;
     color: white;
     cursor: pointer;
   }

记得将这些样式导入到Vue项目中，比如在`App.vue`或其他需要的地方通过`<style scoped>`标签引入。