0

通常の文字で構成された長さが不明な文字列があるとします。

文字列に基づいて幅が常に4行になるように調整するにはどうすればよいですか？

アップデート：

これがトリックです：

$("p").css({height: $("p").height()*4});
$("p").css({width: $("p").width()/4});

理にかなっています。高さを4倍に増やしたい場合は、幅を4倍に減らすことを期待します。

4

2 に答える 2

1

あなたが何をしようとしているのかわかりませんが、あなたがする必要のないことをしようとしているようですが、ここに私がそれをするいくつかの方法があります。

<p class="my_p">Blabla</p>

CSSのみ

<style>p.my_p{height: 40px; overflow: hidden;}</style>

または行の高さを持つjQuery

$(function (){
var p = $('.my_p');
var lh = p.css('line-height');
var x = 0;
var i = false;
while (i!='done')
  {
   if(x>3500) i='done';//prevent infinite loop
   x++; 
   lh = parseInt(p.css('line-height'))*4;
   if(p.height()==lh){ i='done'; console.log('done') }
   else p.width(p.width()+1);
  }
});

</ p>

これがそのためのjsfiddleです... http： //jsfiddle.net/xRxga/1/

それが役に立てば幸い...

または、省略記号を使用します。

コンテンツが広すぎる場合は、省略記号（...）をHTMLタグに挿入します

于 2012-06-26T15:48:07.283 に答える
0

編集：あなたの質問を完全に読んでいませんでした。ここに、あなたが求めているものに向けたもう少しのギアがあります。

正確に 4 行の高さを動的に取得するには、CSS クラスを作成して、テキストのスタイル設定 (font-size など) を含める必要があります。次に、次のようにします。

var p = document.createElement("p");
p.innerHTML = "random text";
$(p).addClass("textStyle");
var fourLineHeight = parseInt($(p).css("line-height")) * 4;

編集 2: samsamX が指摘したように、line-height の方が優れています。

于 2012-06-26T15:28:09.893 に答える