这是因为你有一个无效的HTML代码：

<li class="categories">Kατηγορίες<ul>
_________________________________^^^^

浏览器会将您的代码评估为以下格式，这就是为什么您的所有li都被隐藏的原因：

<ul>
    <li class="categories">Kατηγορίες
       <ul>
          <li class="cat-item cat-item-123"><a href="https://poiimata.com/category/robert-frost/">Robert Frost</a>
          </li>
          <li class="cat-item cat-item-124"><a href="https://poiimata.com/categoryshlain-goldberg/">Shlain</a>
          </li>
       </ul>
    </li>
</ul>

相反，它应该是：

<ul>
  <li class="categories">Kατηγορίες</li>
  <li class="cat-item cat-item-123"><a href="https://poiimata.com/category/robert-frost/">Robert Frost</a>
  </li>
  <li class="cat-item cat-item-124"><a href="https://poiimata.com/categoryshlain-goldberg/">Shlain</a>
  </li>
</ul>

片段：

.categories {
  display: none;
}

<ul>
  <li class="categories">Kατηγορίες</li>
  <li class="cat-item cat-item-123"><a href="https://poiimata.com/category/robert-frost/">Robert Frost</a>
  </li>
  <li class="cat-item cat-item-124"><a href="https://poiimata.com/categoryshlain-goldberg/">Shlain</a>
  </li>
</ul>

您的HTML中似乎有一个错误。你使用了一个不正确的结束标签，因此隐藏了整个东西。

<li class="categories">Kατηγορίες<ul>  <!--- closed <li> with <ul> --->
<li class="cat-item cat-item-123">
    <a href="https://poiimata.com/category/robert-frost/" >Robert Frost</a>
</li>
<li class="cat-item cat-item-124">
    <a href="https://poiimata.com/categoryshlain-goldberg/" >Shlain</a>
</li>

请尝试：

<ul class="categories">
<li >Kατηγορίες<li> 
   <li class="cat-item cat-item-123">
    <a href="https://poiimata.com/category/robert-frost/" >Robert Frost</a>
   </li>
   <li class="cat-item cat-item-124">
    <a href="https://poiimata.com/categoryshlain-goldberg/" >Shlain</a>
   </li>

</ul>

并将CSS更改为

.categories:first-child {
 display:none;  
}

这只是实现它的一种方式。有很多不同的Angular 你可以采取。

由于li包含不需要隐藏的标记，因此需要屏蔽隐藏的文本。例如像这样：

.categories {
  font-size: .1%;
}

.categories ul {
  font-size: 100000%;
}

如果只有子元素就不是bug。..