Home  >  Q&A  >  body text

javascript - 如何在网页中实现网格背景效果

想在网页中画出很小的网格(如图)作为网页的背景,覆盖整个网页,这个的实现思路方法是什么?最好能适应各种设备

怪我咯怪我咯2628 days ago672

reply all(4)I'll reply

  • 高洛峰

    高洛峰2017-04-11 12:30:51

    如果是这种小格子的话,可以采用linear-gradient(transparent 90%, #CCC 90%);再结合background-size: 5% 5%;自动重复就可以了。

    这是DEMO:
    DEMO

    reply
    0
  • 迷茫

    迷茫2017-04-11 12:30:51

    找一个小格子的图片作为背景,repeat-x ,repeat-y

    更新:
    实在是找不到好看的字符画成格子啊,思想就是循环,题主试下看看。做背景的话要考虑层级。。

    for(var a = 0; a<20; a++){
        for(var i=0;i<20;i++) {
            var s = '┍'
            document.write(s);
        }
        document.writeln("<br>");
    }

    reply
    0
  • 黄舟

    黄舟2017-04-11 12:30:51

    一般是用背景图片

    reply
    0
  • 黄舟

    黄舟2017-04-11 12:30:51

    直接设一个小方块为背景,默认会重复排列的至铺满

    reply
    0
  • Cancelreply