less解决function中return写法在浏览器被识别成Object导致样式失败的问题

问题描述:

一开始写的是:

@baseFontSize: 37.5px;//基于屏幕尺寸/10得出的基准font-size// return失败,浏览器显示为[object Object],[object Object]
.pxToRem(@px){@value: @px / @baseFontSize * 1rem;@return @value;
}

使用height: .pxToRem(40px);之后浏览器却是这样:

解决方案一、(不使用return,改成属性名称: 属性值的形式)

@baseFontSize: 37.5px;//基于屏幕尺寸/10得出的基准font-size.px2rem(@name, @px){@{name}: @px / @baseFontSize * 1rem;
}

 使用.px2rem(height, 40px);就正常了:

解决方案二、(使用自定义函数)

.remMixin() {@functions: ~`(function(){var rem = 37.5;this.pxToRem = function(size) {return (size / rem) + 'rem';}})()`;
}
.remMixin();

使用:

height: ~`pxToRem(40)`;

我的less插件和less-loader版本为 :

"less": "3.13.1",
"less-loader": "5.0.0",

代码仓库地址:

命运推手/my_web

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.rhkb.cn/news/463812.html

如若内容造成侵权/违法违规/事实不符,请联系长河编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

VR 创业之路:从《I Expect You To Die》到未来展望

今年是 Reality Labs 成立 10 周年,Meta 每周都会与不同的 XR 先驱进行交流,探讨他们在行业中的经历、经验教训以及对未来的展望。本次,他们与游戏设计师、作家兼 Schell Games CEO Jesse Schell 进行了深入交谈,了解了他的个人故…

面试经典 150 题:189、383

189. 轮转数组 【参考代码】 class Solution { public:void rotate(vector<int>& nums, int k) {int size nums.size();if(1 size){return;}vector<int> temp(size);//k k % size;for(int i0; i<size; i){temp[(i k) % size] nums[i];}nums temp; }…

数据结构 —— AVL树

目录 1. AVL的概念 2.AVL树的结构 3.AVL树的插入 3.1 平衡因子更新 4. 旋转 4.1 旋转的原则 4.2 右单旋 4.2.1 右单旋代码实现 4.3 左单旋 4.3.1 左单旋代码实现 4.4 左右双旋 4.4.1 左右双旋代码实现 4.5 右左双旋 ​编辑 4.5.1 右左双旋代码实现 5. AVL树的判断…

交换机如何实现2.5G网络传输速率和网络变压器有关吗

华强盛电子导读&#xff1a;I19926430038 交换机实现2.5G网络传输速率涉及多个因素&#xff0c;其中包括硬件设计、端口支持、传输介质以及网络协议等。网络变压器在其中扮演了一个重要的角色&#xff0c;但并不是唯一的因素。 1. **硬件设计**&#xff1a;交换机需要有支持2.…

「C/C++」C++设计模式 之 抽象工厂模式(Abstract Factory)

✨博客主页何曾参静谧的博客&#x1f4cc;文章专栏「C/C」C/C程序设计&#x1f4da;全部专栏「VS」Visual Studio「C/C」C/C程序设计「UG/NX」BlockUI集合「Win」Windows程序设计「DSA」数据结构与算法「UG/NX」NX二次开发「QT」QT5程序设计「File」数据文件格式「PK」Parasoli…

【pycharm jupyter】启动报错

报错信息 upyter server process exited with code 1 ServerApp] A _jupyter_server_extension_points function was not found in jupyter_lsp. Instead, a _jupyter_server_extension_paths function was found and will be used for now. This function name will be depre…

精密机械代加工服务,为你的企业加速发展!

在当今竞争激烈的工业领域&#xff0c;精密机械代加工服务正成为众多企业实现快速发展的关键助力。这种专业服务凭借其独特的优势&#xff0c;为企业解决了诸多生产难题&#xff0c;推动企业在市场中大步向前。 先进的技术与设备 精密机械代加工服务提供商通常配备了先进的加工…

Data+AI━━揭秘千亿参数背后的技术较量:全球巨头的大模型布局!

DataAI━━揭秘千亿参数背后的技术较量&#xff1a;全球巨头的大模型布局&#xff01; 前言大语言模型:AI技术创新的新高地智能技术创新的"深水区"智能革命的下一站 前言 站在2024年科技创新的潮头&#xff0c;一场由大语言模型引发的技术革命正在上演。从ChatGPT引爆…

jmeter压测工具环境搭建(Linux、Mac)

目录 java环境安装 1、anaconda安装java环境&#xff08;推荐&#xff09; 2、直接在本地环境安装java环境 yum方式安装jdk 二进制方式安装jdk jmeter环境安装 1、jmeter单机安装 启动jmeter 配置环境变量 jmeter配置中文 2、jmeter集群搭建 多台机器部署jmeter集群…

草料二维码:低成本高效率的访客管理解决方案

在当前的商业和政治环境中&#xff0c;企业和政府机构越来越重视安全保密措施&#xff0c;尤其是对外来人员的行踪记录和管理。访客管理已成为企业运营中不可或缺的一环&#xff0c;它不仅提升了安全性&#xff0c;还增强了效率和便捷性。然而&#xff0c;许多机构仍在使用传统…

AOSP刷机

手机电脑都换了 从新复习一下吧 刷机分为几类 线刷 介质&#xff1a;通过USB数据线连接手机与电脑。 方法&#xff1a;通常使用专门的刷机工具&#xff08;如ADB、Fastboot、Odin等&#xff09;将ROM文件直接刷入设备。 优点&#xff1a;一般可以进行更全面的刷机操作&#x…

unocss 添加支持使用本地 svg 预设图标,并支持更改大小

安装 pnpm install iconify/utils 在配置文件 unocss.config.ts&#xff1a; presets > presetIcons 选项中 通过 FileSystemIconLoader 加载本地图标&#xff0c;并指定目录。 import presetWeapp from unocss-preset-weapp import { extractorAttributify, transformer…

一篇文章理解CSS垂直布局方法

方法1&#xff1a;align-content: center 在 2024 年的 CSS 原生属性中允许使用 1 个 CSS 属性 align-content: center进行垂直居中。 <!DOCTYPE html> <html lang"en"><head><meta charset"UTF-8" /><meta name"viewpo…

基于STM32+华为云IOT设计的大棚育苗管理系统

文章目录 一、前言1.1 项目介绍【1】项目开发背景【2】设计实现的功能【3】项目硬件模块组成 1.2 设计思路1.3 系统功能总结1.4 开发工具的选择【1】设备端开发【2】上位机开发 1.5 模块的技术详情介绍【1】NBIOT-BC26模块【2】MQ135传感器【4】SHT30传感器【5】B1750传感器 二…

小家电常用防水触摸IC

小家电常用防水触摸IC 挑战100个ICMAN“芯”实验-小家电常用防水触摸IC 电容式触摸芯片通常用于实现触摸控制&#xff0c;可轻松解决家用电器常见的触摸感应不灵敏和有水误触发的问题&#xff0c;优化了用户的交互使用体验&#xff0c;从而有效实现控制面板触摸按键的触摸感应和…

C++和OpenGL实现3D游戏编程【连载17】——着色器进阶

欢迎来到zhooyu的专栏。 主页网址&#xff1a;【zhooyu】 专栏网址&#xff1a;【C和OpenGL实现3D游戏编程】 &#x1f31f;&#x1f31f;&#x1f31f;这里将通过一个OpenGL实现3D游戏编程实例教程&#xff0c;带大家深入学习OpenGL知识。知识无穷而人力有穷&#xff0c;希望…

2342423

c语言中的小小白-CSDN博客c语言中的小小白关注算法,c,c语言,贪心算法,链表,mysql,动态规划,后端,线性回归,数据结构,排序算法领域.https://blog.csdn.net/bhbcdxb123?spm1001.2014.3001.5343 给大家分享一句我很喜欢我话&#xff1a; 知不足而奋进&#xff0c;望远山而前行&am…

《Python游戏编程入门》注-第4章8

2.2 “黄色炸弹”的实现 “黄色炸弹”实际上是不断重复地从屏幕顶端落下的黄色圆圈。 2.2.1 设置炸弹位置及下落速度 从图1中可以看出,“黄色炸弹”落下的位置(水平方向)是随机的,图8所示代码用来设置炸弹位置及下落速度。 图8 设置炸弹位置及下落速度的代码 其中,bom…

如何打开/关闭 GitLab 的版本检查功能?

本文分享如何打开/关闭 GitLab 的版本检查功能。 极狐GitLab 是 GitLab 的中国发行版【https://dl.gitlab.cn/ncecn6kb】&#xff0c;中文版本对中国用户更友好&#xff0c;文章以私有化部署的极狐GitLab 实例来演示版本检查功能的开启和关闭。强烈不建议关闭该功能&#xff0…

Linux——Ubuntu环境C编程

配置vim编辑器 设置一个tab键为4个空格 打开/etc/vim/vimrc文件&#xff0c;此文件为只读&#xff0c;所以要用sudo访问boot权限&#xff1a; set ts4&#xff08;设置一个tab键为4空格&#xff09; set nu&#xff08;vim编辑器下显示行号&#xff09; gcc编译器 gcc命令…