企业网站设计网格布局

弹性盒子布局适用于一维布局，即横向布局或者竖向布局。无法解决二维布局的复杂需求（叶文全，基于CSS网格布局的新一代网页布局方法研究：西安文理学院学报(自然科学版)，2018）。为此W3C组织又推出了CSS网格布局，它将网页分成具有简单属性的行和列，注意它不同于最原始的表格table布局或display:table布局，它充分体现了结构和表现高度分离。

网格布局涉及到父元素和子元素两个部分，设置父元素的display属性设置为grid（或者inline-grid）时，那么这个元素就是一个网格容器，它的所有直接子元素就成了网格项。如图2所示，通过示意图，可以看到网格布局所用到的常用元素。它看上去类似于表格，由行和列组成。

其中每一行或者每一列叫做网格轨道，注意当我们把局部元素定义网格时，我们定义的就是网格轨道。每一个单元格叫做网格单元，它是网格布局中的最小单位。由若干单元格构成的区域叫做网格区域，它呈矩形形状。每一条线叫做网络线，网格线从左到右或者从上到下依次顺序编号。

Tags：网格   企业网站   布局   设计

转载：感谢您对雨滴无声个人博客网站平台的认可，以及对网站分享的经验、工具及文章的青睐，非常欢迎各位朋友分享到个人站长或者朋友圈，但转载请说明文章出处。http://www.lcfqcl.com/xd/6148.html

很赞哦！ ()