uniapp 在uni.scss 根据@mixin定义方法 、通过@include全局使用

在官方文档中提及到uni.scss中变量的使用,而我想定义方法,这样写css样式更方便

一、官方文档的介绍

根据官方文档我知道,在这面定义的变量全局都可使用。接下来我要在这里定义方法。

二、在uni.scss文件中定义方法

我在uni.scss文件中定义了 flex的简写方法。

css 复制代码
@mixin flex-teng($direction, $justify, $align, $wrap) {
  display: flex;
  flex-direction: $direction;
  justify-content: $justify;
  align-items: $align;
  flex-wrap: $wrap;
}

我在文件中使用

css 复制代码
.test{
		@include flex-teng(row, space-between, center, nowrap);
		padding: 20rpx 0;
}
相关推荐
顾安r23 分钟前
11.22 脚本打包APP 排错指南
linux·服务器·开发语言·前端·flask
万邦科技Lafite28 分钟前
1688图片搜索商品API接口(item_search_img)使用指南
java·前端·数据库·开放api·电商开放平台
yinuo2 小时前
网页也懂黑夜与白天:系统主题自动切换
前端
Coding_Doggy2 小时前
链盾shieldchain | 项目管理、DID操作、DID密钥更新消息定时提醒
java·服务器·前端
用户21411832636022 小时前
dify案例分享-国内首发!手把手教你用Dify调用Nano Banana2AI画图
前端
wa的一声哭了2 小时前
Webase部署Webase-Web在合约IDE页面一直转圈
linux·运维·服务器·前端·python·区块链·ssh
han_2 小时前
前端性能优化之CSS篇
前端·javascript·性能优化
k***85842 小时前
【SpringBoot】【log】 自定义logback日志配置
android·前端·后端
小满zs2 小时前
Next.js第十章(Proxy)
前端
d***9354 小时前
Webpack、Vite区别知多少?
前端·webpack·node.js