返回课程

CSS Flexbox

编程代码 · HTML/CSS

💡 CSS Flexbox 弹性布局:导航栏水平排列、间距、对齐
.nav {// 选择 nav 导航容器
  display: flex;// 启用 Flex 弹性布局
  gap: 16px;// 子元素之间间距 16px
  align-items: center;// 垂直居中对齐
  justify-content: space-between;// 两端对齐(首尾贴边,中间均分)
}// 样式结束
.nav-item {// 选择导航子项
  flex: 1;// flex: 1 让每个子项等宽分配空间
  text-align: center;// 文字居中
}// 样式结束
0 字/分0% 准确
🐵
.右手无名指
ESC 暂停 退格