【问题标题】:hide border if there is no content如果没有内容则隐藏边框
【发布时间】:2014-10-30 19:39:52
【问题描述】:

在一个 div 上我设置了 css:

div.class {border: 1px solid red;}

div 绝对位于页面的中心。问题是即使没有内容也会出现边框。

如果没有内容,有什么css方法可以让边框不出现?

【问题讨论】:

  • 在语义上似乎有一个没有内容的 div。是否可以仅在内容可用时将 div 写入页面?

标签: html css css-selectors


【解决方案1】:

CSS3 为这种情况定义了一个选择器。但它在 IE8 及更低版本中不起作用。

div.class:empty { 
    border: none;
}

您最好的选择是在服务器端进行调整,如果该 div 为空,则根本不显示该 div。

【讨论】:

  • @Ascherer 可以,但在这种情况下肯定不是最佳做法。
  • 取决于实际情况
  • 这个也可以和:not结合
  • 在命名插槽上的 Web 组件内不起作用
【解决方案2】:

如果 div 可以包含与服务器响应相关的内容,您可以判断它是空响应还是填充响应,并相应地更改为 display:none 或 display:block

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2012-01-08
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多