前言
关于主包偷懒用AI本来想自动用Element Plus组件库生成一个登录界面的表单，结果发现自动登录跟忘记密码怎么在一起了，我马上去看了css样式，可能是忘记分散两个元素了justify-content: space-between了
一检查发现不对，怎么该有的都有了，很完美的flex布局啊，主包甚至还狠狠地加了三个！important，甚至怀疑自己学的假的flex
问题不在css说明就在html，一开始先检查的html觉得很正常，一张表单里面套了很多个表单元素,一个表单元素el-form-item套着两个元素，完全没有问题,后面回来看发现，只是我以为，因为我把表单元素当盒子看了（坚信AI一定不出错），而且Element Plus中也是这么套的
后面我把表单元素el-form-item换成 div，就成功了，最后还得是你万能的 div哈哈哈
非常完美！
我是一个非常非常渺小的新人，不知道博客发什么，只能发现一点东西就发出来，不要喷我，大家都是新手过来的。
新手复习处：
1、justify-content
CSS 中 justify-content 属性的各种取值及其用法说明，该属性用于控制 flex 容器中元素在主轴方向上的对齐方式
| 取值 | 作用说明 | 适用场景示例 |
|---|---|---|
flex-start | 所有元素向主轴起点对齐（默认值） | 元素左对齐（主轴为水平方向时） |
flex-end | 所有元素向主轴终点对齐 | 元素右对齐（主轴为水平方向时） |
center | 所有元素在主轴上居中对齐 | 元素水平居中（主轴为水平方向时） |
space-between | 元素之间平均分配空间，首尾元素紧贴容器两端 | 导航栏（两端元素贴边，中间均匀分布） |
space-around | 元素两侧分配相等空间，首尾元素距离容器边缘的空间是元素间距的一半 | 卡片均匀分布，保留边缘空隙 |
space-evenly | 元素之间及元素与容器边缘的空间完全相等 | 严格均匀分布的网格元素 |
start | 与 flex-start 类似，但会考虑书写模式（如 RTL 从右到左） | 多语言布局适配 |
end | 与 flex-end 类似，但会考虑书写模式 | 多语言布局适配 |
left | 元素向容器左侧对齐（不受主轴方向影响） | 需要强制左对齐的场景 |
right | 元素向容器右侧对齐（不受主轴方向影响） | 需要强制右对齐的场景 |
2、!important
!important 是 CSS 中用于强制提升样式优先级的修饰符：
- 作用：让带它的样式跳过默认权重规则，优先生效
- 用法：写在属性值后（如
color: red !important;） - 注意：仅作用于单个属性，滥用会破坏 CSS 层叠逻辑，建议少用
