scss实现不一样方向的三角

//定义一个三角的函数 实现不一样方向的三角加兼容ie6//第一个参数传入方向//第二个参数传入大小//第三个参数传入颜色//注意:传入参数中间必须逗号分隔@mixin triangle($x, $y:10px, $z:white ){    @if $x == "top"{        border-width: $y;        border-color:transparent transparent $z transparent;        border-style: dashed dashed solid dashed;    }    @else if $x == "bottom"{        border-width: $y;        border-color: $z transparent transparent transparent;        border-style: solid dashed dashed dashed;    }    @else if $x == "left"{        border-width: $y;        border-color:transparent $z transparent transparent;        border-style: dashed solid dashed dashed;    }    @else if $x == "right"{        border-width: $y;        border-color:transparent transparent transparent $z;        border-style: dashed dashed dashed solid;    }    width: 0;    height: 0;    overflow: hidden;}.box{    @include triangle(right, 200px, red);}
相关文章
相关标签/搜索