开发者社区 问答 正文

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

众所周知*1

•在CSS中,如果我们要绘制一个 __椭圆__,一般代码如下:

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

•展示样式如下:
screenshot
众所周知*2

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

展开
收起
杨冬芳 2016-06-07 18:29:12 2111 分享 版权
1 条回答
写回答
取消 提交回答
  • IT从业

    改成:

    border-radius: ~'100px/50px';

    或者
    全选复制放进比例
    border-radius: 50%;

    就可以不执行运算符,而正确编译

    2019-07-17 19:30:41
    赞同 展开评论
问答分类:
问答地址: