我怎么能做这种边界?

时间:2012-10-11 14:05:25

标签: css image design-patterns border

我是否必须使用图像制作这种...我甚至不知道如何解释它(我的母语不是英语),但它是从顶部到较暗部分的过渡这个网站: http://thegregthompson.com/ 。我使用图片,还是可以使用非过于复杂的CSS进行此操作? (伪元素很好)

3 个答案:

答案 0 :(得分:1)

最好的方法是使用图像。你可以在canvas元素中做一些高级的Javascript,但这是漫长,艰难和不必要的方式。

该网站使用this image

答案 1 :(得分:1)

如果您指的是锯齿状的边缘/迷你三角形,那么在更简单的时间内,您可以更好地使用重复的http://thegregthompson.com/wp-content/themes/GregThompson/assets/img/border-top.png重新创建它。

我确信在纯粹的CSS中它是可能的,但它肯定不会“不要过于复杂”,我首先想到的是会有很多不必要的标记。

我希望这会有所帮助

答案 2 :(得分:0)

这就是他们正在使用的:

.sub_hold_top {
    height: 10px;
    background-image: url('../img/border-top.png');
    width: 100%;
    float: left;
}

<强> Full path of Image