如何用CSS隐藏li的一部分内容？

Question

在下面的代码中，我想隐藏“Hello world”，但使用CSS保持我的ul.myphotos可见。

以下是我的例子：

<ul class="content">
    <li>
        Hello world
        <ul class="myphotos">
            <li>Photo1</li>
            <li>Photo2</li>
        </ul>
    </li>
</ul>

Answer 1

你不能用你拥有的代码那样做（好吧，是的，你可以使用一些相当“hacky”的技巧......）。

我建议一个干净的解决方案：将该文本包装在一个单独的标签中，例如：

<ul class="content">
    <li>
        <span>Hello world</span>
        <ul class="myphotos">
            <li>Photo1</li>
            <li>Photo2</li>
        </ul>
    </li>
</ul>

现在你可以很容易地说：

li > span{
   display:none;
}

Answer 2

将Hello World放入带{id的<span>标签中，然后将其隐藏起来。