0

さまざまな寸法 (CSS で定義)height:50px, width:100px. があります。それぞれの内部のテキストを約半分に分割し (長すぎる場合のみ)、必要に応じて拡大して収まるようにします。

テキストの長さに余分なスペースが必要な場合、3行以上に分割されてオーバーフローしますが、テキストを非表示にしたりスクロールしたりしたくありません。

ここでコードを見ることができます:

CSS:
    div {
        font-size: 20px;
        border: 1px solid;
        width: 100px;
        height: 50px;    
    }
html:
     <div>Lorem ipsum dolor sit amet</div>
4

2 に答える 2

1

これは CSS だけではできません。JavaScript を使用して高さを検出し、それに応じてボックス幅のフォント サイズを調整する必要があります。

于 2013-03-04T21:37:47.297 に答える
0

これでうまくいくはずです

div {
display: inline-block;
border: 1px solid;
width: 100px;
height: 50px;  
overflow: hidden;
}

もちろん、別のテキストや長いテキストがある場合は、幅と高さを交互にする必要があります — このトピックでは (前述のように) 複数のソリューションが提供されています (PHP/CSS)。

于 2013-03-04T21:46:03.767 に答える