0

内部にテキストを配置する予定の可変幅の Web サイトがあります<div>。アイデアは

<div>FIRST LINE TEXT HERE</div>
<div>THE SECOND LINE TEXT HERE. BUT QUITE LENGTHY</div>
<div>THIRD LINE IS HERE. NOT THAT MUCH LENGTH<div>

コンテンツの内側と外側の幅に基づいて文字間隔を動的に追加することにより、3 行すべてを正当化された文字のように表示する必要があります<div>。

4

2 に答える 2

1

JavaScript でテキストの幅を計算し、必要な文字間隔を計算して追加できます。これは、単語のスペースを他の文字と同じように扱うことに注意してください。したがって、スペースが追加されるほど、単語同士がより近くに表示されます。結果は、他の点でも誤字に問題があります。文字の間隔が広すぎると、単語の見栄えが悪くなります。

ほんの少しの間隔が必要な場合は、通常、単語の間隔を追加することをお勧めします。一部のブラウザー (Chrome 以外) では、text-align-last: justify. text-justify: newspaper単語間だけでなく、文字間に追加されたスペースの一部を配置する可能性があるため、追加で を使用することを検討できます。jsfiddleを参照してください。

于 2013-01-16T09:39:02.697 に答える
0

これを試してみることをお勧めします.行に3つの異なるクラス、つまりfirst_line、second_line、および同様にthird_lineを指定します

次に、クラスの css を記述します。first_line では、文字間隔を希望どおりに保ちます。同様に、他の 2 行にも文字間隔を指定できます。

于 2013-01-16T05:06:51.250 に答える