是否可以每75px改变边框的颜色？

Question

我想在我的网站的左侧和右侧放置一个3种交替颜色的边框，高度为75px。左侧很容易 - 有很多div，每个高度为75px。我只是使用CSS nth-of-type选择器来交替边框颜色。然而，我网站的右侧是一个未知宽度和高度的div，其中包含我网站的内容。如果我无法使用nth-of-type选择器，我怎样才能达到同样的效果？

这是我左手边框的一部分：

我不想使用图像。只要用户的浏览器不符合规范，CSS3就会很好地降级。

Answer 1

您可以使用带有repeating-linear-gradient的{​​{1}}或图片伪造该边框。

background-size

http://codepen.io/anon/pen/yDqrb

否则，请查看 div { height:300px; background:repeating-linear-gradient(to bottom,#0194BE 0, #0194BE 75px, orange 75px, orange 150px, #E2D397 150px, #E2D397 225px) repeat-y; background-size:2px 225px; } http://www.w3.org/TR/css3-background/#border-images的使用情况。

如果你使用多个背景，你可以绘制所有边框甚至做假列