如果文本溢出到两行，请添加换行符

Question

我有一个使用.liquid和HTML / CSS等构建的电子商务网站... 在馆藏/类别页面上，我所有的书名都有不同的长度（有些超过2行，有些超过1行）。

问题在于产品名称下方是一个色板，价格和评论明星，我在桌面上有4列。如果标题真的很长，则会使色板/价格下降，并且使评论元素向下一行，而且看起来并不令人愉悦。

如果标题在一行中溢出，并且没有提示，那么在网站之后是否可以通过其他方式知道该标题。这样，色板/价格/评论总是内联的。

这是我的网站和我的意思的屏幕截图。

Answer 1

您还可以通过设置最大宽度和省略号溢出来截断标题，如下所示：

title {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 200px;
}