vue3如何写全局样式

1.新建全局样式文件kanno.scss

在src/assets/style文件夹中新建kanno.scss

css 复制代码
.is-required {
    .el-input__wrapper {
        box-sizing: border-box;
        background: rgba(255, 196, 59, 0.1);
    }

    .el-input__wrapper:hover {
        // border: 1px solid #3592FF;
    }
}

.kanno{
    width: 200px;
    height: 200px;
    color: rgb(99, 18, 250);
    background-color: rgb(38, 226, 0);
}

2.全局引用

在mian.js文件中引入,import "@/assets/styles//kanno.scss";

3.使用全局样式

html 复制代码
<div class="kanno">kanno</div>

4.说明

也可以直接在main.css文件中直接引入kanno.scss

相关推荐
li-xun4 分钟前
我的在线工具箱继续升级:新增 Token 计算器、AI 提示词生成器和开发者格式化工具
javascript·django·html5
ikoala6 分钟前
Codex 怎么买、怎么充值?先把这两套计费搞清楚
前端·javascript·后端
wuhen_n30 分钟前
RAG 优化实战:检索精准度提升全方案
前端·langchain·ai编程
Mike_jia32 分钟前
DataEase:人人可用的开源BI神器,企业数据决策民主化实战指南
前端
lichenyang45335 分钟前
从一次“重新发送 / 重新生成”开始,聊聊流式聊天状态机到底解决了什么问题
前端
前端Hardy36 分钟前
一个时代结束了:npm 终于对 install 脚本下手了
前端·javascript·后端
撑死胆大的37 分钟前
2026开发变局:国标落地后,软件开发彻底换赛道
前端·低代码·ai·大模型
悟空瞎说1 小时前
最新 React Native 推送通知完整实战指南
前端
GuWenyue1 小时前
前端异步请求踩坑?3种方式搞定Ajax数据交互,从XHR到async/await
前端·javascript·设计模式