Web开发

CSS Grid布局完全指南

nizhaohai 2024年03月07日 1 分钟阅读 4954 次浏览 0 条评论

CSS Grid是CSS中最强大的布局系统。

基本概念

.container {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: auto;
    gap: 20px;
}

.container {
    grid-template-areas:
        'header header header'
        'sidebar main main'
        'footer footer footer';
}

grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));

nizhaohai

暂无评论，来发表第一条评论吧！

昵称 *

邮箱 *

网站

评论内容 *