使用CSS网格布局创建一个包含头部、左边栏、主体内容和页脚的通用页面布局，共划分为四个网格项目。设置网格容器列数为12（每列宽度为1fr）。头部（一号元素）占据所有列，从一号蓝线到终点负一。主体内容容器（三号项目）位置从二号蓝线至终点负一。左边栏（二号项目）位于主体内容之左。页脚（四号项目）设置在底部占据全宽。自动生成的行大小按内容自适应。通过样式修改可以调整二号元素至主体内容右侧，通过order属性调整元素层级，以防止相互覆盖。