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.mzph.cn/bicheng/59268.shtml

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

相关文章

【04】【Maven项目热部署】将Maven项目热部署到远程tomcat服务器上

1.虽然现在Maven中央仓库中支持的tomcat插件只支持到tomcat7这个版本,但是可以利用这个插件对Web项目进行热部署,热部署到远程服务器的tomcat服务器上,远程服务器上的tomcat版本可以是更高的版本,比如说tomcat8、9、10或更高的版本…

开源一款前后端分离的企业级网站内容管理系统,支持站群管理、多平台静态化,多语言、全文检索的源码

大家好,我是一颗甜苞谷,今天分享一款前后端分离的企业级网站内容管理系统,支持站群管理、多平台静态化,多语言、全文检索的源码。 前言 在当今的数字化时代,企业网站和个人博客已成为信息传播和品牌建设的重要渠道。…

mfc | mfc集成opencv,实现摄像头监控、拍照、视频图像处理(亮度、对比度、色调、饱和度)功能

这里是引用 文章目录 一、开发环境二、MFC项目创建三、集成opencv3.1 opencv安装3.2 添加项目属性3.3 测试OpenCV(打开摄像头)3.4 OPENCV视频嵌入到弹框中 四、关闭摄像头、拍照功能实现4.1 添加按钮4.2 添加全局静态变量4.3 关闭摄像头功能实现4.4 拍照…

Rust 力扣 - 289. 生命游戏

文章目录 题目描述题解思路题解代码题目链接 题目描述 题解思路 我们记录上一行和当前行转换之后的状态,当前行转换之后的状态计算完毕后调整上一行状态,直至最后一行状态计算完毕后调整最后一行状态 题解代码 pub fn game_of_life(board: &mut V…

【eNSP】华为ensp快速入门实验

一、安装准备 1. 检查和卸载已安装的软件 检查是否已经安装 eNSP 和依赖软件: 打开控制面板,点击“程序和功能”。 搜索列表中是否存在 eNSP 或依赖软件(如 WinPcap、Wireshark)。 卸载已安装的软件: 如果找到 e…

一:Linux学习笔记(第一阶段)-- 安装软件 vmware workstation 虚拟机软件 centos系统

目录 学习计划: 资源准备 虚拟机软件:就别自己找了 现在换网站了 下载比较费劲 Centos8: 阿里云镜像地址下载(下载比较版 但是有不同版本):centos安装包下载_开源镜像站-阿里云 百度网盘地址&#xff…

Java项目:165 springboot人事管理系统

作者主页:舒克日记 简介:Java领域优质创作者、Java项目、学习资料、技术互助 文中获取源码 项目介绍 人事管理系统分为管理员和用户两部分操作角色 本次开发的人事管理系统实现了财务报销管理、字典管理、试卷表管理、试题表管理、考试记录表管理、答题…

单臂路由实现不同VLAN之间设备通信

转载请注明出处 本实验为单臂路由配置,目的为让不同VLAN之间的设备能够互相通信。 1.首先,按照要求配置两个pc的ip地址,以pc0为例子: 2在交换机创建vlan10和vlan20 3.划分vlan,pc0为vlan10的设备,pc1为vla…

【FL0013】基于SpringBoot和微信小程序的机电公司管理信息系统

🧑‍💻博主介绍🧑‍💻 全网粉丝10W,CSDN全栈领域优质创作者,博客之星、掘金/知乎/b站/华为云/阿里云等平台优质作者、专注于Java、小程序/APP、python、大数据等技术领域和毕业项目实战,以及程序定制化开发…

2024保姆级微信 AI 机器人教程:如何打造私人和群聊助手

欢迎点击领取 -《前端开发面试题进阶秘籍》:前端登顶之巅-最全面的前端知识点梳理总结 *分享一个使用比较久的🪜 大家好,我是SunnyRun 微信 AI 机器人-人工智能技术,为用户提供服务的自动化系统:具备自然语言处理能…

HyperWorks进阶教程:Altair及其软件介绍

1.1 Altair 简介 Allair是一家全球技术公司,在产品开发、高性能计算和数据智能领域提供软件和云解决方案自1985年成立以来一直致力于为企业的决策者和技术的执行者开发用于仿真分析、优化、信息可视化、流程自动化和云计算的高端技术。Altair 公司的总部位于美国密…

Halcon3D image_points_to_world_plane详解

分三个部分来聊聊这个算子 一,算子的参数介绍 二,算法的计算过程 三,举例实现 第一部分,算子的介绍 image_points_to_world_plane( : : CameraParam, WorldPose, Rows, Cols, Scale : X, Y) 参数介绍: CameraParam,:相机内参 WorldPose 世界坐标系,也叫物体坐标系(成…

使用GetX实现GetPage中间件

前言 GetX 中间件(Middleware)是 GetX 框架中的一种机制,用于在页面导航时对用户进行权限控制、数据预加载、页面访问条件设置等。通过使用中间件,可以有效地控制用户的访问流程,并在适当条件下引导用户到所需页面。 这…

[java][基础]HTTPTomcatServlet

1,Web概述 1.1 Web和JavaWeb的概念 Web是全球广域网,也称为万维网(www),能够通过浏览器访问的网站。 在我们日常的生活中,经常会使用浏览器去访问百度、京东、传智官网等这些网站,这些网站统称为Web网站。如下就是通…

CUDA环境安装终极指南——Linux(其它系统也一样)

文章目录 前言检查驱动配置nvcc安装cudnn完活 前言 不用看其它文章了,这篇文章保你不踩任何坑,安装方法简单快速 检查驱动 检查驱动是否安装,输入以下命令 nvidia-smi如果驱动已经安装,则可跳过此步,否则&#xff…

基于MATLAB的身份证号码识别系统

课题介绍 本课题为基于连通域分割和模板匹配的二代居民身份证号码识别系统,带有一个GUI人机交互界面。可以识别数十张身份证图片。 首先从身份证图像上获取0~9和X共十一个号码字符的样本图像作为后续识别的字符库样本,其次将待测身份证图像…

OpenCV—calcHist()函数

void calcHist( const Mat* images, int nimages,const int* channels, InputArray mask,SparseMat& hist, int dims,const int* histSize, const float** ranges,bool uniform true, bool accumulate false ); images 输入的数据指针,要具备相同的尺寸和数…

小米内外衣双区洗双洗烘洗衣机:洗出健康,还是洗出“噱头”

大家好,我是小悟。 在我们生活的这个科技飞速发展的时代,没有什么是一成不变的,就连洗衣机都在不断地推陈出新,生怕自己被时代的洪流甩在后面。这不,前不久,小米就又给我们带来了一款“划时代”的产品——…

MATLAB——矩阵操作

内容源于b站清风数学建模 数学建模清风老师《MATLAB教程新手入门篇》https://www.bilibili.com/video/BV1dN4y1Q7Kt/ 目录 1.MATLAB中的向量 1.1向量创建方法 1.2向量元素的引用 1.3向量元素修改和删除 2.MATLAB矩阵操作 2.1矩阵创建方法 2.2矩阵元素的引用 2.3矩阵…

C++STL——list

C教学总目录 list 1、list简介2、构造函数3、迭代器4、访问和容量函数5、修改类函数6、操作类函数 1、list简介 list是带头双向循环链表&#xff0c;也是模板类&#xff0c;使用时要指明类型&#xff0c;包含于头文件<list> 由于list是双向循环链表&#xff0c;在任意位置…