0

私はリストを作成していますが、リストの一部の項目は短く、一部または非常に長いです。テキストが長い場合、改行したくありません。新しい行を作成せずにフォントサイズを小さくして、1行に収まるようにする方法を探しています。線幅のようなもの?! または、次の行に移動するときに残りのテキストを表示したくない場合はどうなりますか。したがって、テキストが行よりも大きい場合は、次の行に残りを表示しません。

これが私がこれまでに行ったことです：

  .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;
   }

何か案が？

4

1 に答える 1

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 > $("div").width) その後、サイズ変更を行います。

于 2013-09-07T17:07:20.430 に答える