0

高さと幅がロックされたボックスを作成する必要があります。テキスト コンテンツがボックスの高さを超える場合は、自動的に短くしたいと考えています。

このような： 

<div style="height:100px; width:100px; border:solid 1px #000;">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque scelerisque gravida augue, in luctus nibh feugiat et. In lacinia.
</div>
4

4 に答える 4

2

探している CSS ステートメントは、おそらく次のとおりです。

text-overflow: ellipsis;

省略記号 (…) を使用してテキストを短縮します。quirksmode.org には例があります。

複数行のブロックについては、この Stack Overflow questionを参照してください。

于 2013-01-12T21:25:56.997 に答える
0

私はしばらく前にこの問題を抱えていtext-overflow:ellipsis;ましたが、高さを制限したい複数行の単一行テキストに最適ですが、ThreeDotjqueryプラグインはより多くのオプションを備えた複数行テキストに最適であることがわかりました。

また、dotdotdotプラグイン。

于 2013-01-12T21:27:59.357 に答える
0

これがオーバーフローCSSプロパティの目的であり、[QuirksModeで]その例を見ることができます。1

テキストをどのように短縮したいかを知らなければ、私は恐れている例をあなたに与えることはできません。

于 2013-01-12T21:28:13.570 に答える
0

ユーザー入力を固定長に切り詰める場合は、次を使用します
。この例では、ユーザー入力を 100 文字に制限するテキストエリアを作成し、残りの数もユーザーに表示します。

ステップ 1 - 関数の作成

次のコードをページ ヘッドに挿入します。

<script language="javascript" type="text/javascript">
function limitText(limitField, limitCount, limitNum) {
    if (limitField.value.length > limitNum) {
        limitField.value = limitField.value.substring(0, limitNum);
    } else {
        limitCount.value = limitNum - limitField.value.length;
    }
}
</script>

ステップ 2 - テキストエリアを作成する

次のコードを使用して、フォームとテキスト エリアを作成します (必要に応じて、必要に応じてフォームとテキスト エリアの名前を変更します)。

<form name="myform">
<textarea name="limitedtextarea" onKeyDown="limitText(this.form.limitedtextarea,this.form.countdown,100);" 
onKeyUp="limitText(this.form.limitedtextarea,this.form.countdown,100);">
</textarea><br>
<font size="1">(Maximum characters: 100)<br>
You have <input readonly type="text" name="countdown" size="3" value="100"> characters left.</font>
</form>

これをテキストボックスに適用したい場合は、このリンクに従ってください

于 2013-01-12T21:32:24.730 に答える