Question

我正在制作一个列表，列表中的某些项目很短，而且有些或者非常灵活。如果文本很长，我不想创建一个新行。我正在寻找一种方法，不要让一个新的行，只是减少字体大小，然后它可以坐在一行。像线宽这样的东西？！或者如果我想在下一行显示文本的其余部分时该怎么办？因此，如果文本比它刚刚放置的那条线要大......而不是在下一行显示其余部分。

这是我到目前为止所做的：

  .Music li .songName{
    background:url(img/play-button.png) no-repeat left center;
    background-size:40px;
    padding-left:45px;
    float:left;
    padding:5px;
    font-size:40px; 
    text-transform:uppercase;
    font-family: 'Raleway', sans-serif; 
    font-weight:300;
   }

有什么想法吗？

Answer 1

在简单的CSS中，我认为它不可能，或者它不会跨浏览器兼容（尤其是IE）。所以解决方案是使用javascript / jQuery。我发现这个插件http://fittextjs.com/可以帮助你调整文本大小（还没试过）。
我正在考虑的其他解决方案是在div / span元素中添加文本并测量它的宽度和父div，并在页面加载时调整大小（这里有类似的震荡：http://css-tricks.com/forums/topic/is-it-possible-to-adapt-font-size-to-div-width/）我希望这可以帮助您进行研究并解决您的问题:)以下是主题（http://jbdes.net/dev/js/fontsize.html）的示例。它必须稍加修改

示例：if（$（“span”）。width＆gt; $（“div”）。width）然后进行调整大小。

如何在溢出的情况下不让文本换行

1 个答案: