如何：懸停但不是：元素的第一個孩子？

我試圖擺脫元素的第一個孩子懸停，但沒有先進的。請問，你能幫助我嗎？這是我試圖調整的代碼，但沒有希望。如何：懸停但不是：元素的第一個孩子？

HTML 

       <ul class="nav navbar-nav navbar-right navs-header"> 
        <li style="color: white!important;"><a>Меню</a></li> 
        <?php if (Yii::$app->keyStorage->get('prolongation_enabled')): ?> 
         <li><a href="<?= \yii\helpers\Url::toRoute('/site/prolongation'); ?>">Пролонгация</a></li> 
        <?php endif; ?> 
        <?php if (Yii::$app->keyStorage->get('shop_enabled')): ?> 
         <li><a href="<?= \yii\helpers\Url::toRoute('/site/shop'); ?>"> Интернет - магазин</a></li> 
        <?php endif; ?> 
        <li><a href="<?= \yii\helpers\Url::toRoute('/site/about'); ?>">О ломбарде</a></li> 
        <li><a href="<?= \yii\helpers\Url::toRoute('/site/services'); ?>">Наши услуги </a></li> 
        <li><a href="<?= \yii\helpers\Url::toRoute('/site/news'); ?>">Новости </a></li> 
        <li><a href="<?= \yii\helpers\Url::toRoute('/site/contacts'); ?>">Связаться с нами</a></li> 
       </ul> 



    SAAS 

.navs-right { 
    li{ 
     border-top: solid 1px #b8b8b8; 
    &:first-child{ 
     background-color: #fbce00; 
     color: white!important; 
     font: 17px $fontFamilyAvBold!important; 
    } 
     a{ 
     font: $font17Size-Regularfamily; 
     padding: 15px 30px!important; 

     &:not(:first-child):hover{ 
      color: #fbad30!important; 
      font: 17px $fontFamilyAvBold!important; 
     } 
     } 

    } 
    }

來源

2017-09-26 Feruza

選擇器似乎正在工作。 –

也許你有一個特殊的問題，你有一個codepen與所有涉及的代碼，使更容易調試嗎？ –

@JesusLugo我用html添加了整個代碼。你可以查看 – Feruza

感謝張貼的代碼，理想的交易將使用外部網站，如codepen。 io的;對我們來說更容易讀取outpunt代碼而不是PHP（我很習慣SCSS）。另一方面，CSS中的類.navs-right不存在於標記中。

據我所知，問題在於標記內部，每個鏈接都是:first-child（每個<li>標籤內），所以您需要使用父項的第一個子項，對於這種情況，輸出代碼應該是這樣的：

.navbar-right li:not(:first-child) a:hover { 
    color: #fbad30!important; 
    font: 17px $fontFamilyAvBold!important; 
}

這應該使它工作。你可以在這裏看到https://codepen.io/jelur/pen/WZpbNP

結果現在，在代碼的其他意見：

如果你想要的鏈接，有填充（或保證金），你需要使用display: inline-block（或塊）。
我建議你反對過度使用!important

希望這有助於中。

來源

2017-09-26 16:20:48

它的工作謝謝你的答案！） – Feruza

不客氣，很高興它幫助 –

你需要用你的a在容器是這樣的：

.hvr a:not(:first-child):hover { 
 
    color: #fbad30!important; 
 
}

<div class="hvr"> 
 
<a href="#">Link Text 1</a> 
 
<a href="#">Link Text 2</a> 
 
</div>

來源

2017-09-26 06:14:35 kravisingh

如何：懸停但不是：元素的第一個孩子？

回答

相關問題