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

相关推荐
程序员海军10 分钟前
我用了 8 个月 Codex CLI,总结出这套 AI 编程工作流
前端·后端·aigc
大家的林语冰16 分钟前
Express 团队官宣:全新网站正式上线,Logo 重做,支持两个主版本文档无缝切换!
javascript·node.js·express
এ慕ོ冬℘゜26 分钟前
手写一款高兼容、零BUG图片预览组件|前端
前端·bug
铁链鞭策大师35 分钟前
javaEE之多线程(2)
java·前端·java-ee
KaMeidebaby38 分钟前
卡梅德生物技术快报|生信实操:ChIP 染色质免疫共沉淀技术流程、短板与替代方案详解
前端·人工智能·物联网·百度·新浪微博
weixin1997010801639 分钟前
[特殊字符] 【性能提升300%】仿1688首页的Webpack优化全记录(附构建分析Python脚本)
前端·python·webpack
海兰1 小时前
【文字三国志:第五篇】天命重构,游戏前端UI设计
前端·人工智能·游戏·语言模型
时寒的笔记1 小时前
LF11期_day19~20 补环境(二)入门案例
javascript
海鸥-w1 小时前
前端学习python第二天手敲笔记整理
前端·python·学习
爱吃提升1 小时前
Figma 组件库搭建清单(含命名规范+常用组件模板)
前端·javascript·figma