如何在CSS中实现像数学笔记本一样的页面?

时间:2014-01-26 16:34:52

标签: css

嘿,我是CSS的初学者,所以任何人都可以告诉我如何从孩子的数学笔记本中获得网站背景作为一个页面。 下面是我要放置的图像。

Background texture

2 个答案:

答案 0 :(得分:3)

你走了: http://jsfiddle.net/yng7j/1/

CSS:

html{
    background-image: url('http://s8.postimg.org/v2ugecde9/background.png');

}

看一下图片。基本上,它只是一个小的白色矩形,顶部和左侧有紫色边框。它会在x和y方向自动重复。

答案 1 :(得分:1)

上述解决方案不再有效,无论如何我认为更简单(且更可配置)的解决方案是使用 CSS 函数 linear-gradient,如下所示:

body{
    background-size: 20px 20px;
    background-image: linear-gradient(90deg, black 1px, transparent 0px), linear-gradient(black 1px, transparent 0px);
}