0

我有一个使用 CSS 绘制网格线的背景。你可以在这个小提琴中看到它

看起来不错,但是网格从四分之一正方形开始,我希望它从整个正方形开始。这个怎么做?

我试过使用margin-left -50px;,但这也会影响这个 DIV 中的内容(我不想要)。

CSS:

.board {
    position: absolute;
    margin: 0px;
    top: 0px;
    left: 0px;
    width: 576px;
    height: 576px;
    background-color: #434343;
    background-image: linear-gradient(0deg, transparent 24%, rgba(255, 255, 255, 0.05) 25%, rgba(255, 255, 255, 0.05) 26%, transparent 27%, transparent 74%, rgba(255, 255, 255, 0.05) 75%, rgba(255, 255, 255, 0.05) 76%, transparent 77%, transparent), linear-gradient(90deg, transparent 24%, rgba(255, 255, 255, 0.05) 25%, rgba(255, 255, 255, 0.05) 26%, transparent 27%, transparent 74%, rgba(255, 255, 255, 0.05) 75%, rgba(255, 255, 255, 0.05) 76%, transparent 77%, transparent);
    background-size: 100px 100px;
}

对此有什么想法吗?

4

2 回答 2

3

您可以将background-position元素添加到您的类中:

.board {
    background-position: 27px 27px;
}

第一个值是水平位置,第二个值是垂直位置。您也可以使用%而不是px

于 2014-10-09T15:56:05.613 回答
0
#page {
        background-color:#269;
        background-image: linear-gradient(white 2px, transparent 2px),
        linear-gradient(90deg, white 2px, transparent 2px),
        linear-gradient(rgba(255,255,255,.3) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.3) 1px, transparent 1px);
        background-size:100px 100px, 100px 100px, 20px 20px, 20px 20px;
        background-position:-2px -2px, -2px -2px, -1px -1px, -1px -1px
    }
于 2016-10-11T14:26:42.033 回答