scss 数学运算，加减乘除运算

最新推荐文章于 2024-02-07 18:44:18 发布

原创最新推荐文章于 2024-02-07 18:44:18 发布 · 1w 阅读

2 ·

CC 4.0 BY-SA版权

文章标签：

#scss #css

scss 专栏收录该内容

1 篇文章

订阅专栏

本文介绍了一种使用SCSS预处理器进行基本数学运算的方法，包括加法、减法、乘法和除法，并通过具体代码展示了如何在样式表中应用这些运算。

/*加法*/
$min-width: 200px;
$max-width: 600px;

.container {
  width: $min-width+$max-width; // 800px;
  margin: 0 auto;
}
/*减法*/
.content{
  width: $max-width - $min-width; // 400px
  float: left;
}
/*乘法*/
.border-box {
  width: 10px * 2; //20px
}

/*除法-需要在外面添加一个小括号( )*/
.border-box {
  width: (100px/2)+ 100px; //150px
}