div内的响应文本大小

Question

我遇到了一些CSS的问题。

我正在使用PHP制作一些价格标签，但不幸的是，当产品名称超过三行时，它会将价格标签推出div。是否有任何方法可以使文本的大小响应Div内部的约束？

  

Answer 1

您的解决方案似乎与产品标题位于同一内容块中。我将两者分开，以便产品名称浮在顶部，而价格浮动在底部;每个都在自己的div。使用JavaScript实现客户端检查的唯一方法是使用JavaScript，因此我在HTML中的某处包含一个小代码段（也就是说，如果您不想使用JS ..？）。

通过这样做，您可以使用：

检查标题div的高度

function countLines(Titlediv) {
    var Lines = (Titlediv.offsetHeight)/(Titlediv.style.lineHeight);
    alert(Lines);
}

如果要强制标题适合2行或更少，则需要根据容器div的width评估较小的字体大小比例。我会检查这个JS API：http://simplefocus.com/flowtype/