CSS布局学习笔记的相关内容

文章 2024-09-27 来自：开发者社区

css布局-弹性布局学习笔记

flex容器的属性 flex-direction: 决定主轴的方向： row(默认值)：设置主轴为水平方向，起点在左端row-reverse：设置主轴为水平方向，起点在右端column：设置主轴为垂直方向，起点在上沿column-reverse: 设置主轴为垂直方向，起点在下沿 fle...

文章 2022-09-10 来自：开发者社区

css:Grid网格布局学习笔记

Flex 布局是轴线布局，只能指定"项目"针对轴线的位置，可以看作是一维布局。Grid 布局则是将容器划分成"行"和"列"，产生单元格，然后指定"项目所在"的单元格，可以看作是二维布局。Grid 布局远比 Flex 布局强大。.grid { /* 块级元素 */ display: grid; }容器属性1、划分行和列指定列宽 grid-template-columns 指定行高 ...

文章 2022-09-10 来自：开发者社区

css:Grid网格布局学习笔记

.grid { /* 块级元素 */ display: grid; } 容器属性1、划分行和列指定列宽 grid-template-columns 指定行高 grid-template-rows 允许的值： 100px 100px 100px; 33.33% 33.33% 33.33%; repeat(3, 33.33%); （重复的次数，重复值） repeat(auto-fi...