特定のタグにカラーを適用するにはどうすればいいですか？

Question

私は、次の構造をしました：あなたは、私が3個のaタグをした見ることができますどのように

<li class="dsq-widget-item">  
    <a href="https://disqus.com/by/"><img class="dsq-widget-avatar" src="#"></a> 
    <a class="dsq-widget-user" href="https://disqus.com/by//">Foo</a>  
    <span class="dsq-widget-comment"> 
     <p>Hello</p> 
    </span> 
    <p class="dsq-widget-meta"> 
     <a href="#">How to</a>&nbsp;·&nbsp;<a href="#">19 minutes ago</a> 
    </p> 
</li> 

を、私は二aタグに（例えば青のような）カスタムカラーを適用する必要があります。

実際にすべてのリンクが、このクラスを持っている：

.widget a { 
color: #777; 
} 

すべてのソリューション

Answer 1

.dsq-widget-item a:nth-child(2) { 
    color: #777; 
} 

またはあなたが確信している場合：

.dsq-widget-user {color: #777;} 

Answer 2

2番目のリンクは、クラスを持って、これだけをそれをターゲットにしてください。

a { 
 
color: #777; 
 
} 
 

 
.dsq-widget-user { 
 
    color: red; 
 
}

<li class="dsq-widget-item">  
 
    <a href="https://disqus.com/by/"><img class="dsq-widget-avatar" src="#"></a> 
 
    <a class="dsq-widget-user" href="https://disqus.com/by//">Foo</a>  
 
    <span class="dsq-widget-comment"> 
 
     <p>Hello</p> 
 
    </span> 
 
    <p class="dsq-widget-meta"> 
 
     <a href="#">How to</a>&nbsp;·&nbsp;<a href="#">19 minutes ago</a> 
 
    </p> 
 
</li>

Answer 3

私はスタイルシートにこのコードを入れていると、あなたは私が子セレクタを使用していた

ここ

.dsq-widget-item > a:nth-child(2){ 
    background-color: red; 
} 

所望の出力を得るでしょう、あなたはより多くを参照することができますhere

作業コード：

.dsq-widget-item > a:nth-child(2){ 
 
\t \t \t background-color: red; 
 
\t \t }

<li class="dsq-widget-item">  
 
    <a href="https://disqus.com/by/"><img class="dsq-widget-avatar" src="#"></a> 
 
    <a class="dsq-widget-user" href="https://disqus.com/by//">Foo</a>  
 
    <span class="dsq-widget-comment"> 
 
     <p>Hello</p> 
 
    </span> 
 
    <p class="dsq-widget-meta"> 
 
     <a href="#">How to</a>&nbsp;·&nbsp;<a href="#">19 minutes ago</a> 
 
    </p> 
 
\t </li>