border-image- *属性可以在CSS3中单独使用吗？

有几个边框图像属性，比如border-image-source，border-image-slice，border-image-width，border-image-repeat，border-image-outset，我在一本书中读过说，你不应该使用的属性分别，如：border-image- *属性可以在CSS3中单独使用吗？

.border-image-class { 
    border-image-source: url("image.jpg"); 
    border-image-slice: 10 20 10 20; 
    border-image-releat: repeat; 
}

你我应该写这样的：

.border-image-class { 
    border-image: url("image.jpg") 10 20 10 20 repeat 
}

但W3Schools的给予使用的一些例子单独的属性： http://www.w3schools.com/cssref/css3_pr_border-image.asp

哪一个是对的？

来源

2014-08-29 zenis

两种解决方案都是正确的。这取决于编码器的风格。组合这些值可能会节省一些空间，并且可能会让某些人感到愉快，而分离的属性则可确保可读性。我更喜欢使用SASS中的分隔属性（除边距，填充和边框外）。 – 2014-08-29 03:47:21

任何以简写方式存在的属性也可以使用单独的longhands来声明。这包括border-image。

你使用哪一个完全取决于你;但请记住，在声明shorthands时，您忽略的任何值都将设置为其初始值。这意味着，如果您在一组比较长的特定规则之后使用简写形式，那么即使未用简写形式指定这些长形形式，它们也将被重写。例如，如果你这样做：

.border-image-class { 
    border-image-source: url("image.jpg"); 
    border-image: 10 20 10 20 repeat; 
}

，因为它得到的简写替换none的border-image-source声明将被忽略。

来源

2014-08-29 03:43:03 BoltClock

border-image- *属性可以在CSS3中单独使用吗？

回答

相关问题