div中display为flex时p写满本行换行

可以使用 `flex-wrap` 属性来实现：

div {
  display: flex;
  flex-wrap: wrap;
}

p {
  flex: 1;
}

这样，当 `p` 元素的内容超出一行时，它会被压缩到一行并换行。同时，使用 `flex: 1` 让其自动填充剩余的空间，使得它宽度与其他元素相同。

相关问题

div中p写满本行后换行

可以通过CSS的`word-wrap`属性实现。将`word-wrap`设置为`break-word`，当一行文字超出容器大小时，会自动将单词分割成多行。具体代码如下：

div p {
  word-wrap: break-word;
}

这样，在`<div>`中的`<p>`标签中写满一行后，会自动换行。

一个div中多个p，当p换行时在本行写满后换行

可以使用CSS的`display`属性和`white-space`属性来实现这个效果。具体步骤如下：

1. 设置 div 的 `display` 属性为 `flex`，让多个 p 元素在一行内并排显示；
2. 设置 p 的 `white-space` 属性为 `nowrap`，禁止 p 元素自动换行；
3. 设置 p 的 `overflow-wrap` 属性为 `break-word`，让单词在 p 元素内自动换行。

下面是实现的 CSS 代码：

div {
  display: flex;
  flex-wrap: wrap;
}

p {
  white-space: nowrap;
  overflow-wrap: break-word;
}

这样就可以让多个 p 元素在 div 中横向并排显示，当某个 p 元素的内容超出了一行时，会自动在该元素内部进行换行，而不会影响其他 p 元素的位置。