如何在不使用 jquery 或 js 的情況下應用條件 css

Question

我有這樣的代碼

<div class="abc">
    <componentName > abc </componentName>
    <component2> </component2> 
</div>

component2 正在從 DB 中獲取值，我希望當 component2 沒有得到任何值時，我希望它被隱藏或顯示：無。 但我只能通過 CSS 使用它，我不能在組件中添加任何 class，我不能使用 JS、反應或 jquery。 任何解決方法都會有所幫助。

Answer 1

現在，當它為空時，我已應用display: none; 當它為空或沒有任何價值時。 通過將值放入其中並再次使其為空來進行游戲。 或者您也可以通過檢查元素來檢查 CSS

 componenet2:empty { display: none; }

 <div class="abc"> <componentName > abc </componentName> <componenet2></componenet2> </div>