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

embedded/2025/1/15 23:31:40/

一、@import导入css样式

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

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

 二、scss变量的用法

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

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

 

 

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

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

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

 

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

 


http://www.ppmy.cn/embedded/153868.html

相关文章

Web前端界面开发

前沿:介绍自适应和响应式布局 自适应布局:-----针对页面1个像素的变换而变化 就是我们上一个练习的效果 我们的页面效果,随着我们的屏幕大小而发生适配的效果(类似等比例) 如:rem适配 和 vw/vh适配 …

React使用Redux

Redux Redux 是一个用于 JavaScript 应用的状态容器,Redux 的核心思想是将应用程序的所有状态存储在一个单一的、全局的 store 中,并提供了一套规则来确保状态以一种可预测的方式进行变更. 安装 npm i reduxjs/toolkit react-redux创建目录 创建store文件夹&…

波场靓号生成工具

1、波场靓号地址生成器_精准快速生成TRC20钱包靓号地址 - 波场靓号 波场靓号是什么? 波场靓号是指由你自己选择的TRC20地址,使其看起来不那么普通。 比如: TMBeViiBxxSGmPiMgbvWBwF4ngSbmr8888 TL1234aiqsJacvpji9QWMBazeEbTCKHpTN THoa8888hHCSNt2eW…

腾讯云AI代码助手编程挑战赛-智能聊天助手

作品简介 本作品开发于腾讯云 AI 代码助手编程挑战赛,旨在体验腾讯云 AI 代码助手在项目开发中的助力。通过这一开发过程,体验到了 AI 辅助编程的高效性。 技术架构 前端: 使用 VUE3、TypeScript、TDesign 和 ElementUI 实现。 后端: 基于 Python 开发…

什么是 XSS(跨站脚本攻击)?

XSS(Cross-Site Scripting)是一种常见的安全漏洞,攻击者通过在页面中注入恶意脚本代码,诱导用户的浏览器执行这些代码,从而达到窃取用户数据、伪造操作或劫持用户会话的目的。 XSS 的攻击目标通常是用户的浏览器&…

Python爬虫-爬取汽车之家全部汽车品牌的brandid(品牌ID)

前言 本文是该专栏的第42篇,后面会持续分享python爬虫干货知识,记得关注。 本文以汽车之家平台为例子,获取所有汽车品牌的“全部品牌ID”,即brandid数据。如下所示: 具体的实现思路以及完整实现代码逻辑,笔者将在正文进行详细介绍。废话不多说,跟着笔者直接往下看正文详…

关于C语言初步的一些基础知识整理(2)

“本篇是对于C语言初步中一些基础知识的简单整理,内容较为琐碎,但实用” 在C语言中,格式控制符是用于指定数据输出格式的特殊字符,不同的数据类型有着其对应的格式控制符。具体的: %f 用于输出浮点型数据&#xff08…

【Rust】结构体定义域实例化

目录 思维导图 1. 结构体的定义与实例化 1.1 结构体的基本概念 1.2 定义结构体 1.3 创建结构体实例 1.4 结构体的定义与实例化示例 2. 访问与修改结构体字段 2.1 访问字段 2.2 修改字段 3. 结构体实例的构造函数 3.1 构造函数的定义 3.2 使用字段初始化简写 4. 结…