文本宽度超过最大宽度 table 列

Question

我有一个 table 并且正在使用 <col> 来指定列宽。我的问题是设置为 5% 宽度的列之一有一个 16 个字符的标题，比分配的 5% 更宽并使列宽度更宽。如何让标题以适当的宽度换行并遵守 5% 的宽度？我希望 table 能够响应并且不想以像素为单位设置宽度。我尝试了一个连字符来打破它并将文本换行，但连字符不利于屏幕阅读器。

Answer 1

使用“vw”元素（视口宽度）、“vh”（视口高度）、“vmin”（vw 或 vh 中较小的一个）、“vmax”（vw 或 vh 中较大的一个）等

1 v = 包含块的 1%

使用它看起来像这样：

p {font-size: 2vw;}

这些值是一个大小单位，就像 px 或 em 一样，因此它也可以用于调整其他元素的大小，例如宽度、边距或填充。

以防万一它不起作用使用类似...

p {font-size: 16px; font-size: 2vw;}

或者你可以使用 word-wrap: break-word;这将使它流到下一行

文本宽度超过最大宽度 table 列

Text is wider than max width table column

html

css

width

css-tables