如何在Sass中编写具有多个css属性的变量

Question

我是Sass的学习者，想要在浏览器兼容性中包含25px的边框半径但出现错误。任何帮助，将不胜感激。

$red: #F00; 
 

 
$border-radius: 
 
      -webkit-border-radius:25px; 
 
       -moz-border-radius:25px; 
 
        border-radius:25px;

h5 { 
 
    font-size: 12px; 
 
    padding: 20px; 
 
\t border-radius: $border-radius; 
 
\t background: $red; 
 
}

Answer 1

尝试使用混入。下面是来自Mixin section一个例子：

@mixin border-radius($radius) { 
    -webkit-border-radius: $radius; 
    -moz-border-radius: $radius; 
     -ms-border-radius: $radius; 
      border-radius: $radius; 
} 

您可以使用此像这样：

h5 { 
    @include border-radius(25px); 
    font-size: 12px; 
    padding: 20px; 
    background: $red; 
} 

Answer 2

可以也H5定义一个类，并使用这个类：

.borderClass{ 
    -webkit-border-radius:25px; 
    -moz-border-radius:25px; 
    border-radius:25px; 
} 

h5 { 
font-size: 12px; 
padding: 20px; 
background: $red; 
.borderClass 
}