Html Flex wrap仅包装容器中的一个项目

情况：我有一个

div

，里面有flex和

h1

和

h3

子项

问题：柔性包装无法正确应用于

h1

元素

我尝试的内容：我尝试将

宽度

和

最大宽度

应用于容器，但调整大小时，

h1

标记不换行，但

h3

会换行。 我也尝试过应用

高度
。我已经将flex属性应用于其他容器，但不管发生什么，
h1
都不会移动。
h1
不会换行到另一行。当浏览器调整大小时，它只是停留在原地，被溢出物吞没

预期结果：调整屏幕大小时，
h1
必须包装其字母

片段：

    word-break: break-word;// or break-all;


*{
框大小：边框框；
字体系列：弗朗索瓦一号；
}
身体{
保证金：0；
字体系列：弗朗索瓦一号；
字号：1rem；
线高：1.5；
溢出x：隐藏；
}
.v形头{
高度：100vh；
宽度：100%；
显示器：flex；
对齐项目：居中；
证明内容：中心；
}
.集装箱{
左：1rem；
右侧填充：1rem；
保证金：自动；
文本对齐：居中；
}
.全屏图像包裹{
位置：绝对位置；
排名：0；
左：0；
宽度：100%；
高度：100vh；
溢出：隐藏；
}
.全屏图像包裹图像{
最小宽度：100%；
最小高度：100vh；
}
.标题覆盖{
高度：100vh；
宽度：100%；
位置：绝对位置；
排名：0；
左：0；
背景：rgb（250134188）；
不透明度：0.40；
z指数：1
}
.标题内容{
z指数：2；
显示器：flex；
柔性包装：包装；
证明内容：中心；
溢出：隐藏；
}
.标题内容h1{
字体大小：50px；
颜色：rgb（255、255、255）；
字体系列：Alfa Slab One；
字母间距：10px；
文本转换：大写；
-webkit文本填充颜色：透明；
-webkit文本笔划宽度：2px；
}
.标题内容h3{
颜色：rgb（247,45,146）；
}

20分钟的生活
播客
我想你想破口大骂？因为h1缺少空格，如果不告诉元素打断单词，它将溢出

解决方案：

    word-break: break-word;// or break-all;

工作片段：

    word-break: break-word;// or break-all;


*{
框大小：边框框；
字体系列：弗朗索瓦一号；
}
身体{
保证金：0；
字体系列：弗朗索瓦一号；
字号：1rem；
线高：1.5；
溢出x：隐藏；
}
.v形头{
高度：100vh；
宽度：100%；
显示器：flex；
对齐项目：居中；
证明内容：中心；
}
.集装箱{
左：1rem；
右侧填充：1rem；
保证金：自动；
文本对齐：居中；
}
.全屏图像包裹{
位置：绝对位置；
排名：0；
左：0；
宽度：100%；
高度：100vh；
溢出：隐藏；
}
.全屏图像包裹图像{
最小宽度：100%；
最小高度：100vh；
}
.标题覆盖{
高度：100vh；
宽度：100%；
位置：绝对位置；
排名：0；
左：0；
背景：rgb（250134188）；
不透明度：0.40；
z指数：1
}
.标题内容{
z指数：2；
显示器：flex；
柔性包装：包装；
证明内容：中心；
溢出：隐藏；
}
.标题内容h1{
断字：断字；
字体大小：50px；
颜色：rgb（255、255、255）；
字体系列：Alfa Slab One；
字母间距：10px；
文本转换：大写；
-webkit文本填充颜色：透明；
-webkit文本笔划宽度：2px；
}
.标题内容h3{
颜色：rgb（247,45,146）；
}

20分钟的生活
播客
如果没有一个有效的示例，就无法判断-您能否在问题的一个片段中提供您的HTML？您是否介意再添加一点关于该问题的描述？我可以在调整大小时看到正确的换行。您希望
h1
中的文本做什么？当它是一个单词时，它应该如何包装（以及何时包装）？以前使用flex-wrap已经完成了。我好像再也做不到了。谢谢齐亚德·达里奇。这解决了问题，回答了我的问题。非常感谢你。