将类应用于没有内联跨度的文本

Question

所以我有一个无序列表，每个li包含一个图像和文本。在特定断点处，我隐藏文本但保持图像显示。有没有办法只定位文本而不在其周围放置？我目前正在使用span来显示none，这样可以正常工作。我只是想看看有人有更有效的方法来做到这一点。

<ul>
        <li><a href="#" class="btn_task"><img src="images/ICON-XS-tasks.png" /> <span>Tasks</span></a></li>
        <li><a href="#" class="btn_note"><img src="images/ICON-XS-notepad.png" /> <span>Notes</span></a></li>
        <li><a href="#" class="btn_list"><img src="images/ICON-XS-lists.png" /> <span>Lists</span></a></li>
        <li><a href="#" class="btn_outline"><img src="images/ICON-XS-outlines.png" /> <span>Outlines</span></a></li>
    </ul>

@media (max-width: 500px) { ul li span {display: none;}}

Answer 1

font-size：0px？

我想你只能弄清楚这样的事情。