带有侧边栏的响应式布局
创建带有内容区域和侧边栏的响应式布局。
在父容器上使用display:grid布局，以创建网格布局。
使用minmax()函数作为第二列（侧边栏）以允许它占据px或20%空间。
使用1fr作为第一列（主要内容）以占用剩余空间。
预览效果如下所示：
HTML
divclass="container"main这个元素是1fr大/mainaside最小：像素/最大：20%/aside/div
CSS
.container{display:grid;grid-template-columns:1frminmax(px,20%);height:px;}main,aside{padding:12px;text-align:center;}main{background:#d4f2c4;}aside{background:#81cfd9;}
今天就讲到这里，如果有问题需要咨询，大家可以直接留言或扫下方