Html Flexbox无法移动内容

我目前正在为学校做一个项目，我必须只用CSS重新设计另一个学生的网站。我一直在尝试实现flexbox，但每当我给一个类任何flex属性时，都不会真正发生任何事情。我必须将主体设置为flex容器，因为没有其他选项。我试着做了一些不同的事情，并得到了一个李工作，但就是这样。此时，albums和albums1类几乎没有响应

正文{
宽度：100%；
显示器：flex；
弯曲方向：立柱；
背景：url（img/back.png）；
颜色：#FFF；
字体系列：Ubuntu、Arial、无衬线字体；
}
.导航{
显示器：flex；
背景色：#8AE5D8；
证明内容：柔性端；
}
保险商实验室{
显示器：flex；
弯曲方向：行；
列表样式：无；
}
李阿{
利润率：10px；
文字装饰：无；
文本阴影：1px 1px#000；
字体系列：Ubuntu、Arial、无衬线字体；
字体大小：1.2米；
}
.背景{
高度：200px；
宽度：200px；
调整内容：灵活启动；
边界半径：10px；
}
.专辑，
.相册1{
显示器：flex；
证明内容：中心；
柔性包装：nowrap；
宽度：100%；
对齐项目：居中；
}

日食
希望之城
边缘时刻
爱的链条
坦陀罗（我的眼睛能看见）
一切皆有可能
共鸣
她是个谜
人情
仪式
可能与谁有关
某人
维纳斯

我不完全确定您想要的是什么，而且您提供的代码也不太清楚。我支持评论中关于签出FlexBoxFrogy的建议，认为这是一个有趣而简单的练习，可以了解Flexbox的基本知识

无论如何，下面是一个建议，你可以如何格式化你的布局。我把你的标记去掉了一点，以删除任何图像/覆盖，因为你没有提供太多关于你希望实现什么的信息。最好将重点放在Flexbox布局的基础上，首先要理解，将

display:flex

应用到容器中只会影响到应用它的容器中的子容器。flex项的子体是独立格式化的，与flex容器无关。当您有多个嵌套的flex容器并且需要根据需要更改

flex方向时，这可能会变得有点棘手

无论如何，希望这个例子能对你有所帮助。它也是一把小提琴


正文{
宽度：100%；
保证金：0；
显示器：flex；
弯曲方向：立柱；
背景：黑色；
颜色：#FFF；
字体系列：Ubuntu、Arial、无衬线字体；
}
保险商实验室{
显示器：flex；
柔性包装：包装；
列表样式：无；
}
李阿{
利润率：10px；
文字装饰：无；
文本阴影：1px 1px#000；
字体系列：Ubuntu、Arial、sans-serif；
字体大小：1.2米；
}
ol{
填充：0；
}
欧利{
列表样式位置：内部；
}
.导航{
显示器：flex；
证明内容：柔性端；
右：5%；
背景色：#8AE5D8；
}
.相册容器{
显示器：flex；
证明内容：周围的空间；
对齐项目：居中；
柔性包装：包装；
}
.专辑{
显示器：flex；
弯曲方向：立柱；
利润率：5%；
填充：10px；
背景色：石板灰；
边框：1px纯白；
}







日食
希望之城
边缘时刻
爱的链条
坦陀罗（我的眼睛能看见）
一切皆有可能
共鸣
她是个谜
人情
仪式
可能与谁有关
某人
维纳斯
日食
希望之城
边缘时刻
爱的链条
坦陀罗（我的眼睛能看见）
一切皆有可能
共鸣
她是个谜
人情
仪式
可能与谁有关
某人
维纳斯
日食
希望之城
边缘时刻
爱的链条
坦陀罗（我的眼睛能看见）
一切皆有可能
共鸣
她是个谜
人情
仪式
可能与谁有关
某人
维纳斯
你把
相册
类放在上面的东西没有任何作用，因为它们没有任何子对象，甚至没有文本。例如，
，
您试图对齐其中的项目，而不是使用
自对齐
或其他方式。这个网站是一个很好的可视化flexbox工作方式的网站：这里是一个很好的文档资源：最后是一个很好的教程：id ablums是我想你可能会看到的。就专辑而言，他们被分为albums和albums1两类。专辑中有一个ol儿童元素。我现在意识到我忘了放我想做的事情。很抱歉。基本上，像你在小提琴中所做的那样的运动是我试图实现的，但我根本不被允许对HTML进行任何形式的更改。一切都必须在CSS中完成。谢谢你清理flexbox的东西。我想我可能已经弄明白了。