css{run}
.flex {
color: white;
display: flex;
/* ## Positional alignment ## */
/** 居中排列 */
/* justify-content: center; */
/** Pack items from the start */
/* justify-content: start; */
/** Pack items from the end */
/* justify-content: end; */
/** 从行首起始位置开始排列 */
/* justify-content: flex-start; */
/** 从行尾位置开始排列 */
/* justify-content: flex-end; */
/** Pack items from the left */
/* justify-content: left; */
/** Pack items from the right */
/* justify-content: right; */
/* ## Baseline alignment ## */
/* justify-content: baseline;
justify-content: first baseline;
justify-content: last baseline; */
/* ## Distributed alignment ## */
/** 均匀排列每个元素 首个元素放置于起点,末尾元素放置于终点 */
/* justify-content: space-between; */
/**💕 均匀排列每个元素 每个元素周围分配相同的空间,注意左右两边只有中间的一半 */
/* justify-content: space-around; */
/**❤🌹 均匀排列每个元素 每个元素之间的间隔相等 完美的间距 */
/* justify-content: space-evenly; */
/** Distribute items evenly Stretch 'auto'-sized items to fit the container */
/* justify-content: stretch; */
/* ## Overflow alignment ## */
/* justify-content: safe center; */
/* justify-content: unsafe center; */
/* ## Global values ## */
/* justify-content: inherit; */
/* justify-content: initial; */
/* justify-content: unset; */
}
.flex div {
background-color: saddlebrown;
}