공간을 차지하지 않도록 HTML 테이블 행 <tr>을 어떻게 숨길 수 있습니까?

<tr>공간을 차지하지 않도록 HTML 테이블 행을 숨기려면 어떻게 해야합니까? 여러 <tr>개의을로 설정 style="display:none;"했지만 여전히 테이블의 크기에 영향을 미치며 테이블의 테두리는 숨겨진 행을 반영합니다.

당신의 TABLE 스타일링을보고 싶습니다. 예 : "테두리 붕괴"

추측 일 뿐이지 만 '숨겨진'행이 렌더링되는 방식에 영향을 미칠 수 있습니다.

코드를 포함 할 수 있습니까? 나는 style="display:none;"항상 테이블 행에 추가 하고 전체 행을 효과적으로 숨 깁니다.

설정 <tr id="result_tr" style="display: none;">한 다음 JavaScript로 다시 표시 할 수 있습니다 .

var result_style = document.getElementById('result_tr').style;
result_style.display = 'table-row';

이 잠재적 인 다른 솔루션을 추가 할 생각 :

<tr style='visibility:collapse'><td>stuff</td></tr>

나는 Chrome에서만 테스트했지만 이것을 <tr>놓으면 행을 숨기고 행 내부의 모든 셀이 여전히 열 너비에 기여합니다. 때때로 특정 열이 특정 너비보다 작을 수 없도록하는 스페이서를 사용하여 테이블 하단에 추가 행을 만든 다음이 방법을 사용하여 행을 숨 깁니다. (나는 당신이 다른 CSS로 이것을 할 수 있어야한다는 것을 알고 있지만 나는 그것을 작동시키지 못했습니다)

다시 말하지만 저는 순전히 크롬 환경에 있으므로 다른 브라우저에서 어떻게 작동하는지 전혀 모릅니다.

경우를 display: none;어떻게 설정에 대한 작동하지 않는 height: 0;대신? 요소를 추가로 제거하려면 음수 여백 (상단 및 하단 테두리의 높이와 같거나 그보다 큼)과 함께 사용 하시겠습니까? 나는 상상하지 않는다position: absolute; top: 0; left: -4000px; 그것이 효과가있을 것이라고 시도해 볼 가치가있을 것이다.

내 부분에서는 사용 display: none이 잘 작동합니다.

다음 line-height : 0px; font-size : 0px; height : 0px; margin : 0; padding : 0;

나는 그것을하는 것을 잊는다. IE6의 라인 높이라고 생각합니다.

동일한 문제가 발생하여 각 셀에 style = "display : none"을 추가했습니다.

결국 나는 HTML 주석을 사용했습니다. <!-- [HTML] -->

tr과 함께 스타일 display : none을 사용하여 숨길 수 있으며 모든 브라우저에서 작동합니다.

var result_style = document.getElementById('result_tr').style;
result_style.display = '';

저에게 완벽하게 작동합니다 ..

이것은 나에게 일어 났고 나는 그 이유에 대해 당황했습니다. 그런 다음 nbsp; 나는 행 안에 있었고 행은 공간을 차지하지 않았습니다.

입력 유형을 숨김으로 변경해야합니다. 모든 기능이 작동하지만 페이지에 표시되지 않습니다.

<input type="hidden" name="" id="" value="">

입력 유형이로 설정되어 있으면 나머지를 변경할 수 있습니다. 행운을 빕니다!!

나는 같은 문제가 있었고 문제를 해결했습니다. 이전 CSS는 overflow : hidden이었습니다. Z- 색인 : 999999;

나는 그것을 overflow : visible로 변경한다.

HTML :

<input type="checkbox" id="attraction" checked="checked" onchange="updateMap()">poi.attraction</input>

자바 스크립트 :

function updateMap() {
     map.setOptions({'styles': getStyles() });
} 

function getStyles() {
    var styles = [];
    for (var i=0; i < types.length; i++) {
      var style = {};
      var type = types[i];
      var enabled = document.getElementById(type).checked;
      style['featureType'] = 'poi.' + type;
      style['elementType'] = 'labels';
      style['stylers'] = [{'visibility' : (enabled ? 'on' : 'off') }];
      styles.push(style);
    }
    return styles;
}

position: absolute 레이아웃 흐름에서 제거하고 문제를 해결해야합니다. 요소는 DOM에 남아 있지만 다른 요소에는 영향을주지 않습니다.

당신은 설정할 수 있습니다

<table>
  <tr style="visibility: hidden"></tr>
</table>