如何使用 jQuery 从 DIV 中删除高度样式?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/804161/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How do I remove the height style from a DIV using jQuery?
提问by Zack Peterson
By default, a DIV's height is determined by its contents.
默认情况下,DIV 的高度由其内容决定。
But, I override that and explicitly set a height with jQuery:
但是,我覆盖了它并使用 jQuery 显式设置了高度:
$('div#someDiv').height(someNumberOfPixels);
How can I reverse that? I want to remove the height style and to make it go back to it's automatic/natural height?
我怎样才能扭转这种局面?我想删除高度样式并使其恢复到自动/自然高度?
回答by user268828
to remove the height:
删除高度:
$('div#someDiv').css('height', '');
$('div#someDiv').css('height', null);
like John pointed out, set height to auto
:
就像约翰指出的那样,将高度设置为auto
:
$('div#someDiv').css('height', 'auto');
(checked with jQuery 1.4)
(用 jQuery 1.4 检查)
回答by nonrectangular
$('div#someDiv').height('auto');
I like using this, because it's symmetric with how you explicitly used .height(val) to set it in the first place, and works across browsers.
我喜欢使用它,因为它与您首先显式使用 .height(val) 设置它的方式对称,并且可以跨浏览器工作。
回答by schtsch
you can try this:
你可以试试这个:
$('div#someDiv').height('');
回答by John Boker
maybe something like
也许像
$('div#someDiv').css("height", "auto");
回答by SvenFinke
To reset the height of the div, just try
要重置 div 的高度,请尝试
$("#someDiv").height('auto');
$("#someDiv").height('auto');
回答by Rana Nematollahi
$('div#someDiv').css('height', '');
回答by John Ruddell
just to add to the answers here, I was using the height as a function with two options either specify the height if it is less than the window height, or set it back to auto
只是为了添加到这里的答案,我将高度用作具有两个选项的函数,如果高度小于窗口高度,则指定高度,或者将其设置回自动
var windowHeight = $(window).height();
$('div#someDiv').height(function(){
if ($(this).height() < windowHeight)
return windowHeight;
return 'auto';
});
I needed to center the content vertically if it was smaller than the window height or else let it scroll naturally so this is what I came up with
如果内容小于窗口高度,我需要将内容垂直居中,否则让它自然滚动,所以这就是我想出的
回答by Thomas Cayne
Thank guys for showing all those examples. I was stillhaving trouble with my contact page on small media screens like below 480px after trying your examples. Bootstrap kept inserting height: auto
.
感谢大家展示所有这些例子。我仍然有想你的例子后,像下面480像素的小屏幕媒体与我联系页面的麻烦。Bootstrap 不断插入height: auto
.
Element Inspector / Devtools will show the height in:
Element Inspector / Devtools 将在以下位置显示高度:
element.style {
}
In my case I was seeing: section#contact.contact-container | 303 x 743
in the browser window.
就我而言,我看到的是:section#contact.contact-container | 303 x 743
在浏览器窗口中。
So the following full-length works to eliminate the issue:
因此,以下全长作品可以消除该问题:
$('section#contact.contact-container').height('');
$('section#contact.contact-container').height('');
回答by rahul
$('div#someDiv').removeAttr("height");