web前端入门到实战：CSS 实现网格效果

最新推荐文章于 2022-11-27 18:10:30 发布

白T恤架构师

最新推荐文章于 2022-11-27 18:10:30 发布

阅读量211

点赞数

分类专栏： css 文章标签： css 前端 Web前端前端开发前端教程

本文链接：https://blog.csdn.net/ITHHH111/article/details/106105903

版权

css 专栏收录该内容

59 篇文章 2 订阅

订阅专栏

效果

CSS

专门建立的学习Q-q-u-n ⑦⑧④-⑦⑧③-零①② 分享学习方法和需要注意的小细节，不停更新最新的教程和学习技巧（从零基础开始到WEB前端项目实战教程，学习工具，全栈开发学习路线以及规划）
.grid {

  width: 500px;

  height: 500px;

  background-image: linear-gradient(

    45deg,

    #eeeeee 25%,

    transparent 25%,

    transparent 75%,

    #eeeeee 75%

  ), linear-gradient(

    45deg,

    #eeeeee 25%,

    transparent 25%,

    transparent 75%,

    #eeeeee 75%

  );

  background-size: 50px 50px;

  background-position: 0 0, 25px 25px;

}