【Uniapp-Vue3】@import导入css样式及scss变量用法与static目录

一、@import导入css样式

在项目文件中创建一个common文件夹,下面创建一个css文件夹,里面放上style.css文件,编写的是公共样式,我们现在要在App.vue中引入该样式。

在App.vue中引入该样式,这样就会使样式全局生效:

二、scss变量的用法

打开uni.scss,里面定义了许多变量,我们可以使用。

如:我们使用$uni-color-primary这个颜色变量

如果我们想要自己定义一些变量,就可以以$开头去定义变量:

当然,我们也可以使用导入的方法导入外部的scss文件:

在项目文件中创建一个common文件夹,下面创建一个scss文件夹,里面放上style.scss文件,编写的样式变量:

使用同样的方法导入到uni.scss文件中:

相关推荐
天宇&嘘月2 小时前
web第三次作业
前端·javascript·css
毕业设计-016 小时前
0081.基于springboot+uni-app的垃圾分类小程序+论文
spring boot·小程序·uni-app
HappyAcmen6 小时前
关于uniApp的面试题及其答案解析
uni-app
なし.7 小时前
【Web前端开发精品课 HTML CSS JavaScript基础教程】第二十四章课后题答案
前端·javascript·css·html
狂团商城小师妹8 小时前
挪车小程序挪车二维码php+uniapp
微信小程序·小程序·uni-app·微信公众平台
外派叙利亚8 小时前
uniapp 连接mqtt
uni-app
治金的blog8 小时前
uniapp 右侧刷新图标 和 返回顶部图标的实现
前端·uni-app
努力小贼8 小时前
uni-app发起网络请求的三种方式
前端·javascript·vue.js·uni-app
qq_316837758 小时前
uniapp 拖拽排序
uni-app
林的快手8 小时前
伪类选择器
android·前端·css·chrome·ajax·html·json