隐藏< li>而不会创建空行 [英] Hide <li> without creating empty row

问题描述

$ b

 < ol>< p> 
< li>咖啡< / li> 
< li style =visibility：hidden>牛奶< / li> 
< li>茶< / li> 
< / ol> 
  

但非常地，它会呈现如下的空行：

  1。 Coffee 
 
 3. Tea 
  

我想要的就是这样：

  1。咖啡
 2.茶
  

我在问是否有一个很好的方法来解决这个问题？

解决方案

使用display：none而不是visibility：hidden

编辑： visibility：hidden使元素不可见，但将它保留在DOM的流中，所以它仍然占据相同的空间，如果它不可见，同时显示：无视该元素不在那里以
开头

I am trying to hide a list item by using the following code (for example)

<ol>
  <li>Coffee</li>
  <li style="visibility:hidden">Milk</li>
  <li>tea</li>
</ol>

But unfornately, it renders as follows with an empty row:

1. Coffee

3. Tea

What I want is simply like this:

1. Coffee
2. Tea

I am asking if there is a neat way to fix this? Thanks.

解决方案

Use "display:none" instead of "visibility:hidden"

EDIT: visibility: hidden makes an element invisible but while keeping it in the flow of the DOM, so it still occupies the same space it would if it weren't invisible, meanwhile display: none treats it as if that element isn't there to begin with

这篇关于隐藏< li>而不会创建空行的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！