写less代码减运算时应注意减号和变量之间必须有空格

最新推荐文章于 2024-07-17 15:24:17 发布
最新推荐文章于 2024-07-17 15:24:17 发布
阅读量3.4k 收藏
点赞数
分类专栏： less 文章标签： less
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/microcosmv/article/details/55140092
版权

写less代码时发现了一个bug，就是写less代码减运算时应注意减号和变量之间加入没有空格时减号会被解析为变量的一部分。

例1：

.adapterFuc(@index) when (@index > 0 ) {
  @media (min-width: extract(@adapterList, (@len - @index + 1))) {
  html {
    font-size: extract(@adapterList, (@len - @index+1))/@size * @baseFontSize;
  }
} .adapterFuc(@index - 1);

上述代码中的@len - @index + 1 假如减号与变量之间没有空格，或被认为是变量的一部分，从而出现bug。

以上内容仅作为个人学习记录使用。

microcosmv
关注
专栏目录
媒体查询和LESS、SASS
m0_60969565的博客
09-05 550
媒体查询 响应式布局 针对不同屏幕显示不同效果 媒体查询可以控制在不同屏幕宽度显示的效果 1、通过 @media 关键字定义媒体查询 2、min-width 屏幕最小宽度 3、max-width 屏幕最大宽度 4、给定范围时通过 and 连接 可以用外部和内部样式表 外部可以同时关联多个 <link rel="stylesheet" href="./index600.css" media="(min-width:1000px)"> <link rel="...
SCSS #变量 #嵌套 #导入 #混合器 #继承 #运算 #颜色 #插值 #sass函数
weixin_47234657的博客
12-03 805
#Bootstrap 响应式+栅格布局+scss css特点： 1.语法不够强大 没有合理的代码复用机制 代码难维护 2.用动态的语言 赋予新的样式 3.动态语言：scss stylus less scss是强化辅助工具 在CSS基础上 添加变量 嵌套 混合 导入 函数 指令功能 1.scss的运行原理 scss运行在后台,把scss转换成css文件,传递给前台,让浏览器运行css,我们安装的scss就是把文件转换成css 2.把scss转换成css (1)单文件转换 node-sas
less 子属性加& 避免编译出现空格
u012497072的博客
12-13 236
less中的减号处理
weixin_30892987的博客
04-02 181
很奇怪，less中对减号似乎没有特别说明，很容易让人无用。 @div1Width:500; @div2Width:200px; .div3cls { width:@div1Width-@div2Width; } 会报nameerror错误：NameError: variable @div1Width- is undefined in...
less用法与运算规则
最新发布
weixin_68729791的博客
07-17 307
less是一种动态样式语言，是css的预处理器。（扩展了css语言让css语言有了逻辑，使得css方便扩展，维护复用）可向下兼容，在less中可以写css。
Less：less运算规则（加减乘除及定义变量）
weixin_46682277的博客
01-24 9313
在less文件中，任何数字、颜色或变量都能参与运算，就是less提供了（+）（-）（*）（/）算术的运算。 代码示范： /*是在less文件里写*/ @width:10px + 5; div { /*其实就变成了15px的边框*/ border:@width solid skyblue; } /*生成的css文件是这样的*/ div { border:15px solid skyblue; } /*甚至还以带小括号，比如说下面这种 和数学中的一样，先算小括号再去相乘*/ width:(@width +
less运算
6块腹肌的博客
07-16 757
语法 运算的语法，就是对变量的数字进行加减乘除，如：#222222 ，对这个值进行运算时，会忽略#号，只对数字运算。具体例子如下 HTML <div class="content"> <p>this is content</p> <p>background-color is @color1</p> <...
gulp-less编译后缩进变为 4space 问题
steph_qiu的博客
04-12 700
近日开发过程中发现有个问题，gulp-less在编译less文件的时候，只有一个文件编译后为2space的缩进，其余全部为4space。结果当然是被要求修复。 所有的less文件看起来风格并无什么不同，多次修改后再重新编译，终于发现是tab的问题，只要有tab，gulp-less都会将其编译为4space，毕竟gulp-less已经没啥太大的维护，除了less版本更新可能会跟进外。既然如此就只能
Style笔记(css, stylus,less)
Ndbsa的博客
11-24 590
css，stylus，less各种语法记录
1.Python编程基础(附实战代码)
0x0000
04-09 350
1.2.1 Python简介1.2.1.1 Python的历史与发展Python是一种高级编程语言，由Guido van Rossum于1989年底发明并于1991年首次发布。Python的核心哲学是“简单易读”，因此其语法简洁明了，易于学习。Python已经发展出多个版本，其中最主要的有Python 2和Python 3。Python 2于2000年发布，而Python 3作为Python 2的继任者，于2008年发布。从2020年起，Python 2停止维护，因此建议新学员学习Python 3。
Python基础入门：从变量到异常处理
SeanZz_的博客
08-19 660
前言： Python 是一种通用编程语言，其在科学计算和机器学习领域具有广泛的应用。如果我们打算利用 Python 来执行机器学习，那么对 Python 有一些基本的了解就是至关重要的。本文内容基于阿里天池龙珠计划的Python训练营，结合了自己的一些学习心得，可以作为大家Python入门的参考。 目录 一、变量、运算符与数据类型 1.注释 2.print()函数 3. 运算符 4.变量和赋值 二、条件语句 1.if语句 2.if-else语句 3. if - elif - else.
Less的简单介绍、使用、语法
NewHouser的博客
01-30 2655
less是将CSS简单化的工具，并且拥有更强的逻辑性和计算能力在使用Less时，首先需要下载Less插件，下载完成之后，代码写在less文件中，保存之后会自动生成css文件，并将生成的css文件引入网页文件中。
less知识点总结
Web前端开发工程师
09-26 545
less ​ less是一种动态样式语言，属于css预处理器的范畴，它扩展了 CSS 语言， ​ 增加了变量、Mixin、函数等特性，使 CSS 更易维护和扩展 ​ LESS 既可以在 客户端 上运行 ，也可以借助Node.js在服务端运行。 less的中文官网：http://lesscss.cn/ less初次使用： 1.定义变量（@zero:0）并运用，凡是页面中使用0，都用@zero代替; 2.子元素需要放在父元素中，此时子元素可以放心使用class，因为他已经有前提条件是父元素 不用再继续担心对同
Less 运算
天空之外
10-20 1401
Less 语言中支持运算，我们可以给变量进行一些运算操作，例如加 +、 减 -、乘 *、除 / 四个运算符，这四个运算符可以对任何数字、颜色或变量进行运算。一般运算符在进行加、减计算之前会进行单位换算。计算的结果以最左侧操作数的单位类型为准。如果单位换算无效或失去意义，则忽略单位。 运算的使用 运算的使用其实很简单，就是对属性值或变量进行一些加减乘除运算。 示例： 我们来看下面这段 HTML代码： <!DOCTYPE html> <html> <head>
Less的入门及使用—变量、嵌套规则、混合、运算、避免编译、继承(附代码演示)
王春燕的博客
04-15 2892
一、less简介 less是一种动态样式语言，属于css预处理器的范畴，它扩展了 CSS 语言，增加了变量、Mixin、函数等特性，使 CSS 更易维护和扩展 less的中文官网：
Less的简单使用（一）——变量的用法
热门推荐
疯子i的博客
06-01 3万+
Less的简单使用（一）——变量的用法 Less是css的扩展，Less不仅与CSS向后兼容，而且它添加的其他功能都使用现有的CSS语法。 变量 一、变量正常用法（variables） 在一个位置控制常用值 .less文件中 /**/ Variables @link-color: #428bca; // sea blue @link-color-hover: darken(@lin...
多用less命令，不会输入h查看对应的详细文档
piaoxuwuyu的专栏
01-05 1979
在开发项目时候，难免要查看日志排查错误。之前只会用cat ， more， less， tac， tail的简单功能， 但在实际工程中还是不够用的，至少效率很低。今天抽空看了下以下的博客，并实际进行了简单的操作。 希望以后多用一些这样的方式加快自己的错误排查效率，提高整体的工作效率。 参考文章： http://blog.csdn.net/xyw_blog/article/detail
LESS学习笔记 —— 入门
他叫自己Mr.张
11-26 5120
今天在网上完成了LESS的基础学习，下面是我的学习笔记。 总共有三个文件：index.html、main.less、mian.css，其中 mian.css 是 main.less 经过Koala编译之后自动生成的。 下面是代码： index.html 01 02 03 04 05 06 07 08 09 10 11 12 13 1
php 变量加法,你可能不知道的PHP加减法
weixin_35474374的博客
03-22 513
这可能算不上是一次正规的解说，毕竟有点烧脑。起因是这样的，我们都知道php语法里有自增操作，即 ++，那么下面我列出一个表达式$a = 1;$result = $a + $a++; // $result === 3好的，为什么等于3？只有一种解释，就是自增的优先级高于加减，所以二号位自增导致了一号位也变成2。(3 = 2 + 1)既然一号位变成了2，为何二号位不会变成2呢？因为后置自增的返回值...
编写shell脚本，实现两个变量之间的加减乘除运算。
06-28
### 回答1： 这段英文的意思是“编写Shell脚本，实现两个变量之间的加减乘除运算”。 需要编写一个Shell脚本，首先定义两个变量，并且赋予它们值，然后通过对这两个变量进行运算，实现加、减、乘、除四种运算操作。具体的运算操作可以利用Shell脚本中的数学运算符来实现。 ### 回答2： shell脚本是一种基于Unix/Linux系统的编程语言，可以用于实现各种系统管理和自动化任务。对于实现两个变量之间的加减乘除运算，我们可以利用shell脚本中的算术运算符和条件语句。以下是一种简单的实现方式： #!/bin/bash # 定义两个变量a和b a=5 b=3 # 加法运算 sum=$(($a + $b)) echo "a + b = $sum" # 减法运算 diff=$(($a - $b)) echo "a - b = $diff" # 乘法运算 prod=$(($a * $b)) echo "a * b = $prod" # 除法运算 if [ $b -eq 0 ]; then echo "Cannot divide by zero" else quot=$(($a / $b)) echo "a / b = $quot" fi 在这个脚本中，我们首先定义了两个变量a和b，然后使用算术运算符实现了加法、减法、乘法和除法运算。其中，加法、减法和乘法运算都比较简单，只需要使用加号、减号和乘号拼接两个变量即可。 但是对于除法运算，我们需要加入一些条件判断来避免除以0的错误。在上面的脚本中，我们使用了if条件语句来判断b是否等于0，如果等于0则输出错误信息，否则就进行除法运算并输出结果。 当然，上述脚本中的变量a和b都是预先定义好的，如果想要实现用户输入任意两个数的加减乘除运算，可以使用shell脚本中的read命令来读取用户输入，并将输入的数字保存到变量中，然后再进行运算操作。 ### 回答3： 编写Shell脚本实现两个变量之间的加减乘除运算，我们可以使用Shell内置的算数运算符，并将其封装成函数进行调用。 1. 加法运算 加法运算可以使用`expr`命令或Shell内置的`$(( ))`语法实现，我们这里采用`$(( ))`语法: ```bash add(){ local a=$1 local b=$2 local sum=$((a + b)) echo "$sum" } ``` 运行脚本时，调用函数`add`，传入两个参数，即可完成加法运算。例如： ```bash add 3 5 ``` 输出： ``` 8 ``` 2. 减法运算 减法运算同样可以使用`expr`命令或Shell内置的`$(( ))`语法实现，我们这里采用`$(( ))`语法: ```bash sub(){ local a=$1 local b=$2 local diff=$((a - b)) echo "$diff" } ``` 运行脚本时，调用函数`sub`，传入两个参数，即可完成减法运算。例如： ```bash sub 5 3 ``` 输出： ``` 2 ``` 3. 乘法运算 乘法运算可以使用`expr`命令或Shell内置的`$(( ))`语法实现，我们这里采用`$(( ))`语法: ```bash mul(){ local a=$1 local b=$2 local product=$((a * b)) echo "$product" } ``` 运行脚本时，调用函数`mul`，传入两个参数，即可完成乘法运算。例如： ```bash mul 3 5 ``` 输出： ``` 15 ``` 4. 除法运算 除法运算比较特殊，我们需要利用`bc`命令来实现浮点数除法。同时，我们可以设置`bc`命令的小数精度，保留几位小数。下面是一个实现除法运算的函数: ```bash div(){ local a=$1 local b=$2 local scale=2 #设置小数精度为2位 local quotient=$(echo "scale=$scale;$a / $b" | bc) echo "$quotient" } ``` 运行脚本时，调用函数`div`，传入两个参数，即可完成除法运算。例如： ```bash div 5 3 ``` 输出： ``` 1.66 ``` 完整脚本代码如下： ```bash #!/bin/bash add(){ local a=$1 local b=$2 local sum=$((a + b)) echo "$sum" } sub(){ local a=$1 local b=$2 local diff=$((a - b)) echo "$diff" } mul(){ local a=$1 local b=$2 local product=$((a * b)) echo "$product" } div(){ local a=$1 local b=$2 local scale=2 #设置小数精度为2位 local quotient=$(echo "scale=$scale;$a / $b" | bc) echo "$quotient" } add 3 5 #8 sub 5 3 #2 mul 3 5 #15 div 5 3 #1.66 ```
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值