摘要：
网格容器 VS Flex容器 网格属性 VS Flex属性 阅读全文
摘要：
网格轨道对齐可以相对于网格容器行和列轴。 align-content指定网格轨道沿着行轴对齐方式；justify-content指定网格轨道沿着列轴对齐方式。它们支持下面属性： normal start end center stretch space-around space-between sp 阅读全文
摘要：
CSS的Box Alignment Module补充了网格项目沿着网格行或列轴对齐方式。 1 <view class="grid"> 2 <view class='item1'>1</view> 3 <!-- <view class='item'>2</view> 4 <view class='it 阅读全文
摘要：
网格项目可以具有层级和堆栈，必要时可能通过z-index属性来指定. 1.在这个例子中，item1和item2的开始行都是1，item1列的开始是1，item2列的开始是2，并且它们都跨越两列。两个网格项目都是由网格线数字定位，结果这两个网格项目重叠了。 默认情况下，item2在item1上面，但是 阅读全文
摘要：
1.隐式的指定网格线反向指定了隐式的网格区域名称，命名的网格区域隐式的命名了网格线名称. 指定网格区域会给网格区域边线添加隐式的网格线名称。这些网格线的命名是基于网格区域来命名，只是在网格区域名称的后面添加后缀-start或-end. 1 <view class="grid"> 2 <view cl 阅读全文
摘要：
通常可以将网格线命名成任何你想命名的名称，如果网格线名称添加-start和-end的后缀，其实也隐式的创建一个网格区域，可以用来设置网格项目的位置. 在这个示例中，行和列都具有inner-start和inner-end网格线名称，同时也对应的创建一个隐式网格区域名称inner 1 <view cla 阅读全文
摘要：
当网格项目确认在显式网格之外时就会创建隐性网格，当没有足够的空间或者显式的网格轨道来设置网格项目，此时网格项目就会自动创建隐式网格. 隐式网格可以定义：grid-auto-rows、grid-auto-columns和grid-auto-flow属性 1.在这个例子中我们只定义了一行（轨道），所以i 阅读全文
摘要：
1.像网格线名称一样，网格区域的名称也可以使用grid-template-areas属性来命名。引用网格区域名称也可以设置网格项目位置. 设置网格区域的名称应该放置在单引号或双引号内，每个名称由一个空格符分开. 网格区域的名称，每组（单引号或双引号内的网格区域名称）定义了网格的一行，每个网格区域名称 阅读全文
摘要：
1.使用repeat()函数可以给网格线分配相同的名称。这可以节省一定的时间 使用repeat()函数可以给网格线命名，这也导致多个网格线具有相同的网格线名称。 相同网格线名称指定网格线的位置和名称，也且会自动在网格线名称后面添加对应的数字，使其网格线名称也是唯一的标识符。 1 <view clas 阅读全文
摘要：
使用网格线名称设置网格项目位置和使用网格线号码设置网格项目位置类似. 1.引用网格线名称的时候不应该带方括号 1 <view class="grid"> 2 <view class='item1'>1</view> 3 <view class='item'>2</view> 4 <view clas 阅读全文
摘要：
通过grid-template-rows和grid-template-columns定义网格时，网格线可以被命名。网格线名称也可以设置网格项目位置。 grid-template-rows和grid-template-columns定义你的网格，将名称分配给网格线。 定义网格线名称时需要避免使用规范中 阅读全文
摘要：
默认情况下网格项目跨度只有一个列和行，但可以跨越多个行和列。 1.可以通过设置grid-column-end和grid-column-start距离多个网络线号实现多个列跨越. 1 <view class="grid"> 2 <view class='item1'>1</view> 3 <view 阅读全文
摘要：
网格线实际上是代表线的开始、结束. 两者之间就是网格列或行. 以下css仅对子元素生效 ,具体详情可以看后面示例 以上css会生成两列三行的网格创建三条列网格线和四条行网格线 . 如果一个网格项目跨度只有一行或一列，那么grid-row-end和grid-column-end不是必需的 注意以下几点 阅读全文