Question

这是网站的代码：

<div class="infoBox" style="position: absolute; visibility: visible; width: 450px; left: 504.626px; top: -103.94px;">

<div class="marker-wrapper animated fadeInDown">
    <div class="marker-title"></div>
    <div class="marker-content">
        <div class="two_third popup-content">
            <ul>
                <li></li>
                <li>
                    <span class="icon-link"></span>
                    <a href="http://www.hotelesavant.com" target="_blank" rel="nofollow"></a>
                </li>
            </ul>
        </div>
        <div class="one_third last image-wrapper pop-image"></div>

在自定义CSS上写这个，隐藏整个弹出框：

.popup-content ul li {
margin-bottom: 5px;
color: #5A5A5A;
}

但我只想隐藏这个：

<li>
  <span class="icon-link"></span>
  <a href="http://www.hotelesavant.com" target="_blank" rel="nofollow"></a>
</li>

最诚挚的问候......并提前感谢!!

Answer 1

您可以使用last-child：

.popup-content ul li:last-child { display:none;}

编辑：如果问题中的'LI'元素最终不是最后一个li，那么您可以使用其他选项：

li:nth-child(#index of the element)

在你的情况下：

li:nth-child(1)

除非您当然可以为其添加课程。

Answer 2

向您的li提供id或class，并将visibility属性设置为hidden或collapse：

<li class="hide">
  <span class="icon-link"></span>
  <a href="http://www.hotelesavant.com" target="_blank" rel="nofollow"></a>
</li>

.hide {
    visibility: collapse;
}

我建议collapse超过hidden，因为它甚至不会占用它将使用的空间而不是仅仅渲染透明。 visibility属性的优点是你不仅可以让它消失，而且如果你想保留它占用的空间，你可以让它变得透明。

Answer 3

您可以使用adjacent sibling selector '+'

.icon-link + a {
    display: none;
}

如何隐藏弹出窗口中的特定行

3 个答案: