- grid-area 属性可以用于为网格项分配名称。然后，可以通过网格容器的 grid-template-areas 属性引用命名的网格项目
- grid-template-areas 属性在网格布局中规定区域
- grid-gap 属性定义网格布局中行与列之间间隙的尺寸
- grid-template-columns 属性规定网格布局中的列数（和宽度）
采用grid加栅格布局的方式，方便pc和移动端的转换，同时每个块之间的间距为10，添加上对应的样式，同时给每个区块加上对应的名字、颜色和高度（模拟内容的填充），小屏幕上不显示slider的内容, 当屏幕的尺寸大于500的时候，展示出来slider的内容,当屏幕的尺寸大于800的时候，改变整个布局方式
其实最本质的内容就是对不同的屏幕加载不同的css样式，你也可以使用媒体查询的方式加载css样式
或者@import的方式
版权声明：
本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。
如若内容造成侵权、违法违规、事实不符，请将相关资料发送至xkadmin@xkablog.com进行投诉反馈，一经查实，立即处理！
转载请注明出处，原文链接：https://www.xkablog.com/rfx/24007.html