格子网站模板_格子网站模板怎么做

以下是一个简单的格子网站模板,可以在此基础上进行修改和定制:
```



t
t
t
t


t

t src="script.js">


```
在这个模板中,我们使用了一个简单的容器元素来显示所有的格子。每个格子都有6行,每行包含6个不同的格子。我们使用了 `background-color` 和 `box-shadow` 属性来设置每个格子的背景色和阴影效果。我们还使用了 `cursor: pointer` 属性来让指针出现在每个格子中。
在 `.container` 元素中,我们设置了一个 `max-width` 和 `padding` 属性,让容器元素尽可能大,并设置了 `background-color` 和 `box-shadow` 属性,让容器元素有阴影效果。
在 `.row` 元素中,我们设置了一个 `margin` 属性,让每一行格子向右偏移一定距离,并设置了 `padding` 属性,让每一行格子有更高的高度。
在 `.col` 元素中,我们设置了一个 `float` 属性,让 `.col` 元素在 `.container` 元素中水平居中,并设置了 `width` 属性,让 `.col` 元素的宽度占整个格子的宽度的20%。
最后,我们在每个 `.col` 元素中添加了一个 `active` 状态,用来显示当前未被点击的格子。