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;
}
相关推荐
前端小巷子26 分钟前
JS打造“九宫格抽奖”
前端·javascript·面试
潘小安28 分钟前
『译』资深前端开发者如何看待React架构
前端·react.js·面试
李昊哲小课1 小时前
HTML 完整教程与实践
前端·html
GISer_Jing1 小时前
React 18的createRoot与render全面对比
前端·react.js·前端框架
我叫汪枫1 小时前
React Hooks原理深度解析与高级应用模式
前端·react.js·前端框架
我叫汪枫1 小时前
深入探索React渲染原理与性能优化策略
前端·react.js·性能优化
阿智@111 小时前
推荐使用 pnpm 而不是 npm
前端·arcgis·npm
伍哥的传说2 小时前
QRCode React 完全指南:现代化二维码生成解决方案
前端·javascript·react.js·qrcode.react·react二维码生成·qrcodesvg·qrcodecanvas
IT_陈寒2 小时前
Vite 5.0 终极优化指南:7个配置技巧让你的构建速度提升200%
前端·人工智能·后端
listhi5202 小时前
Map对象在JavaScript循环中的使用
开发语言·前端·javascript