将相同的值设置为多个属性(CSS)

Question

这似乎是一个愚蠢的问题,但我无法在任何地方找到答案.

有没有办法将多个CSS属性设置为一个值

border-left, border-right: 1px solid #E2E2E2;

你可以用选择器做什么？

.wrapper, .maindiv { ... }

Answer 1

不.但是对于您的示例,您可以这样做:

border: solid #E2E2E2;
border-width: 0 1px;

顶部,右侧,底部和左侧可以有单独值的属性(例如,border-*,margin,padding)通常可以组合在一个属性中.

Answer 2

不可能,除非你这样做:

border: 1px solid #E2E2E2;

..四面都有相同的边框.如果要单独控制它们,则必须将它们作为单独的语句编写.

请注意,在某些情况下,您可以为一个属性设置多个值,但在一个语句中不能有多个属性和一个值.

Answer 3

使用普通的css是不可能的,但你可能会看看scss或更少的人可能有你的问题的解决方案.

普通css的解决方案如下:

border: 1px solid #E2E2E2;
border-width: 0px 1px;

Answer 4

如果您使用的是 sass，请尝试以下操作：

@mixin border($properties , $value){
    @each $property in $properties{
        border-#{$property}: $value;
    }
}

selector{
    @include border(left right, 1px solid #E2E2E2);
}