Css 将段落宽度限制为页眉宽度

我有一个标题：

未知宽度

标题下面还有一段话：

Lorem ipsum dolor sit amet

我试图把段落的宽度限制在页眉的宽度。当屏幕大小改变时，标题可能会环绕，占据两行或更多行。在这种情况下，我希望该段落限制为最长行的宽度

我想要一些功能等同于这个虚构CSS的东西：

#header {
    // header style
}

.paragraph {
    max-width: header.width;
    text-align: justify;
}

或者这个：

.container {
    width: fit-content except paragraph;
}

.header {
    // header style
}

.paragraph {
    width: 100%;
    text-align: justify;
}

---

这在不使用JavaScript的情况下是可能的吗？是否可以使用/不使用媒体查询？

您可以使用

CSS变量

并如下设置主标题宽度：

:root {
 --header-width: 50%;
}

并使用

wrap:break-word使
p
标签响应

看看这段代码：


：根目录{
--收割台宽度：50%；
}
#标题{
宽度：var（--标题宽度）；
边框：1px纯黑；
}
.段{
单词包装：打断单词；
最大宽度：var（--标题宽度）；
边框：1px纯黑；
}
未知宽度
Lorem ipsum dolor坐在amet Asfasafassafasafasfasfasfasfasfasfasfas
你能用Javascript/HTML/CSS代码片段函数做个例子吗？我很难想象你的情景。默认情况下，段落和文本都会自动换行以适合其框，即使框受到窗口大小的约束。您是否以其他方式设置文本框的宽度？您需要将标题和段落包装在一个div中，并将样式从标题移动到父div。我不想将标题的宽度设置为50%。我只希望它的宽度适合标题中的文本。我根本不想为它指定宽度。该片段显示了一个50%宽度的标题（比需要的宽）和一个50%宽度的段落。这回答了我的问题：