Question

我的网站上有html代码：

<div id="main" class="col-md-9 col-xs-12"></div>
<div id="right" class="col-md-3 col-xs-12"></div>

如果'md'尺寸为空，可以隐藏'右'列吗？并将'main'调整为col-md-12 THX

Answer 1

您可以使用Javascript测试标记是否为空，然后隐藏元素。

function myfunc(){
  var rightDiv = document.getElementById("right").value;
  if(rightDiv == ""){
    rightDiv.style.visibility="hidden";
  }
}

window.onload=myfunc;

Answer 2

我发现了一个类似的问题：Bootstrap 3 - hide empty grid column

通常，您可以使用PHP（或您的特定服务器端语言）逻辑来应用相应的Bootstrap类，具体取决于列中是否有内容。这可能不应该用CSS来完成。

（您也可以使用JavaScript / jQuery）

bootstrap 3列（隐藏空col）

2 个答案: