최대 높이 설정을 해제하는 방법은?

최대 높이 설정을 해제하는 방법은?

재설정하는 방법max-height일부 CSS 규칙에서 이전에 설정된 경우 속성이 기본값으로 설정됩니까?이것은 작동하지 않습니다.

pre {
  max-height: 250px;
}

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

재설정 위치none:

pre {
  max-height: 250px;
}

pre.doNotLimitHeight {
  max-height: none;
}

언급

다음 css를 사용하여 max-height 특성을 지울 수 있습니다.

max-height:none; 

사용가능

max-height: unset;

이 값은 상위에서 상속할 경우 속성을 상속된 값으로 재설정하고(키워드 상속으로 작동), 상속하지 않을 경우 속성을 초기 값으로 재설정합니다(키워드 이니셜로 작동).

자바스크립트를 사용하여 요소를 다음과 같이 스타일을 지정하는 경우 참고하십시오.$el.style.maxHeight = '50px';사용.$el.style.maxHeight = 'none';"reset" 또는 "제거"하지 않습니다.50px, 그냥 덮어쓸 겁니다이것은 만약 당신이 다음을 사용하여 요소의 최대 높이를 "재설정"하려고 한다면$el.style.maxHeight = 'none';그것은 적용될 것입니다.none의 가치.max-height요소의 속성, 다른 유효한 요소를 재정의함max-height해당 요소와 일치하는 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');.

단일 요소가 아닌 전체 스타일 규칙에 대해 이 작업을 완료하려면 먼저 수정할 규칙을 찾은 다음 호출합니다.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;
  }
}

당신은 찾을 수 있습니다.StyleSheet그리고.CssRule당신이 원하는 대로 물건을 만들 수 있습니다. 하지만 간단한 응용을 위해서는 위의 것으로 충분할 것입니다.

답변으로 말씀드려 죄송합니다만, 제가 50명의 담당자가 없어서 코멘트를 드릴 수가 없습니다.

건배.

둘 중 하나를 사용

max-height: none;

아니면

max-height: 100%;

참고: 두 번째 것은 포함된 블록의 높이에 상대적입니다.

언급URL : https://stackoverflow.com/questions/13988145/how-to-unset-max-height