css|css实现全屏网格效果(斜格)

话不多说,上代码!!!

Document - 锐客网body { margin: 0; }.bdgrid { height: 100%; width: 100%; background-size: 100% 100%; position: fixed; margin: 0; background: -webkit-linear-gradient(45deg, transparent 48px, rgb(133, 133, 134) 1px, transparent 49px), -webkit-linear-gradient(-45deg, transparent 48px, rgb(133, 133, 134) 1px, transparent 49px); background: -ms-linear-gradient(top, transparent 39px, blue 40px), -ms-linear-gradient(left, transparent 39px, red 40px); background-size: 68px 68px; }.bdkgc { opacity: 0.9; width: 100%; height: 100%; position: fixed; -webkit-background-size: 100% 100%; -moz-background-size: 100% 100%; background-size: 100% 100%; }.ctn { font-family: Avenir, Helvetica, Arial, sans-serif; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-align: center; color: #2c3e50; margin-top: 60px; }

效果如下: css|css实现全屏网格效果(斜格)
文章图片

【css|css实现全屏网格效果(斜格)】

    推荐阅读