Question

我正在尝试为以“drop_”开头的所有元素设置Jquery“line-height”css值。当我运行相同的代码将“line-height”替换为“font-size”时，它会正确更新，但无法获得“line-height”更新。任何想法??

$.each($('[id^=drop_]'), function(index, value) {
 alert($(this).css("line-height"));
 $(this).css("line-height", "3.5px");
 alert($(this).css("line-height"));
});

Answer 1

定义行高的推荐方法是使用数字值，称为“无单位”线高。数值可以是任何数字，包括基于小数的数字，如第一个中所使用的那样此页面上的代码示例。
由于孩子的事实，建议使用无单位线高度元素将继承原始数值，而不是计算值值。有了这个，子元素可以根据其行高来计算在他们计算的字体大小，而不是继承任意来自更有可能需要覆盖的父母的价值。

对于line-height属性值，

百分比，px和em值可能导致较差的继承行为并且应该不应该使用。最好使用无单元数字值（例如1.5）。
当值以百分比形式提供时，它相对于元素本身的字体大小。

试试这个，

$.each($('[id^=drop_]'), function(index, value) {
 alert($(this).css("line-height"));
 $(this).css("line-height", "3.5");
 alert($(this).css("line-height"));
});

注意：当我们将值作为无单位数提供时，将乘以元素的font-size来计算行框高度。

Reference

Answer 2

试试这个

＆＃13;

jQuery.each(jQuery('[id^=drop_]'), function(index, value) {
	 alert(jQuery(this).css("line-height"));
	 jQuery(this).css("line-height", "35px");
	 alert(jQuery(this).css("line-height"));
});

＆＃13;

p { line-hieght: 10px; }

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<p id="drop_first">Lorem Ipsum is simply dummy text of the printing and typesetting industry.</p>
<p id="drop_second">Lorem Ipsum is simply dummy text of the printing and typesetting industry.</p>
<p id="drop_third">Lorem Ipsum is simply dummy text of the printing and typesetting industry.</p>
<p id="drop_fourth">Lorem Ipsum is simply dummy text of the printing and typesetting industry.</p>
<p id="drop_fifth">Lorem Ipsum is simply dummy text of the printing and typesetting industry.</p>

＆＃13;

Answer 3

$('.div > p').css('line-height', '3.5px');

请发布您的HTML。或者相应地更改.div > p部分。这应该可以正常工作。

你拥有的，对我来说也很好。如果它不适合您，请尝试使用我的代码更新它。

Jquery .css行高不起作用

3 个答案: