如何自动调整 <td>
的字体大小如果内容进入第二行?我知道如何使用 CSS 和 jquery 增加/减小字体大小,但是如果具有特定类名文本的特定或所有 td 长于一行,如何自动缩小字体大小。
<div style="overflow: hidden;" id="parentDiv" class="scroll">
<div id="4" >
<table id="t4" class="Table">
<tbody>
<tr>
<td id="b4" class="bY"><table id="inner1" width="100%" cellpadding="3">
<tbody>
<tr>
<td class="code" id="code4" width="172"></td>
<td class="Num" id="Num4" width="50"></td>
<td colspan="2" class="Name" id="Name"></td>
</tr>
<tr>
<td class="code" width="172"> </td>
<td> </td>
<td class="serial" width="110"></td>
<td class="serial" width="322"></td>
</tr>
</tbody>
</table></td>
</tr>
</tbody>
</table>
</div>
最佳答案
你想要.filter()
.对于大多数元素,这应该有效:
$(".myClass").filter(function()
{
var el = $(this);
el.css("white-space", "nowrap");
var lineHeight = el.height();
el.css("white-space", "");
return el.height() > lineHeight;
}).css("font-size", "10pt");
处理表格,一行中的所有单元格具有相同的高度,因此检查子元素的值。例如,将所有内容包装在一个 div 中。但是,如果您必须对 <td>
采取行动直接:
$(function()
{
$(".myClass td").filter(function()
{
var el = $(this);
el.closest("tr").andSelf().css("white-space", "nowrap");
var lineHeight = el.height();
el.css("white-space", "normal");
var textWraps = el.height() > lineHeight;
el.closest("tr").andSelf().css("white-space", "");
return textWraps;
}).css("font-size", "10pt");
});
关于javascript - jQuery CSS 字体大小,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/3893507/