如何取消最大高度？

如何将max-height属性重置为默认值，如果以前在某个css规则中设置的话？ 因为这不起作用：

pre { max-height: 250px; } pre.doNotLimitHeight { max-height: auto; //Doesn't work at least in chrome } 

Answer 1

重置为none ：

 pre { max-height: 250px; } pre.doNotLimitHeight { max-height: none; } 

参考

Answer 2

您可以通过使用以下css清除max-height属性：

 max-height:none; 

Answer 3

请注意，如果您使用JavaScript来devise元素，例如$el.style.maxHeight = '50px'; 使用$el.style.maxHeight = 'none'; 将不会“重置”或“删除” 50px ，它会简单地覆盖它。 这意味着如果您尝试使用$el.style.maxHeight = 'none';来“重置”元素的最大高度， 它会将none值应用到元素的max-height属性，覆盖CSSselect规则中与该元素匹配的任何其他有效的max-height属性。

一个例子：

styles.css的

 .set-max-height { max-height: 50px; } 

main.js

 document.querySelectorAll('.set-max-height').forEach($el => { if($el.hasAttribute('data-hidden')){ $el.style.maxHeight = '0px'; // Set max-height to 0px. } else { $el.style.maxHeight = 'none'; // 'Unset' max-height according to accepted answer. }); 

要实际“取消”内联样式，您应该使用$el.style.removeProperty('max-height'); 。

要为整个样式规则完成此操作，而不仅仅是一个元素，则应首先find要修改的规则，然后在该规则上调用removeProperty函数：

 for(let i = 0; i < document.styleSheets[0].cssRules.length; ++i){ if(document.styleSheets[0].cssRules[i].selectorText == '.set-max-height'){ document.styleSheets[0].cssRules[i].style.removeProperty('max-height'); break; } } 

你可以findStyleSheet和CssRule对象，但是对于一个简单的应用程序，我相信上面的就足够了。

对不起，把这个作为答案，但我没有50代表，所以我不能评论。

干杯。