关于 LESS 中对“/”的编译处理

rokeyzki · 2016-01-30T09:17:06Z

众所周知*1 在 CSS 中，如果我们要绘制一个椭圆，一般代码如下： #circleZeta { width : 100px ; height : 50px ; background-color : #47d1eb ; border - radius : 100px / 50px ; // 注意这里的写法 } 展示样式如下：众所周知*2 在 LESS 中，如果我们要将其编译为 CSS 时， LESS 会自动根据 + 、 - 、 * 、 / 等运算符进行尺寸大小的计算于是，如果在 LESS 中绘制椭圆，这一行样式： border-radius: 100px / 50px 就会被编译成 border-radius: 2px ，造成异常。展示样式如下：那么问题来了，有没有前端大大帮忙指点一下，我该如何避免这种情况呢？感谢

This topic created in 3934 days ago, the information mentioned may be changed or developed.

众所周知*1

在CSS中，如果我们要绘制一个椭圆，一般代码如下：

#circleZeta {
  width: 100px;
  height: 50px;
  background-color: #47d1eb;
  border-radius: 100px / 50px; // 注意这里的写法
}

展示样式如下：

众所周知*2

在LESS中，如果我们要将其编译为CSS时，LESS会自动根据 +、-、*、/ 等运算符进行尺寸大小的计算
于是，如果在LESS中绘制椭圆，这一行样式：border-radius: 100px / 50px 就会被编译成 border-radius: 2px，造成异常。
展示样式如下：