特定のクラスにのみ属するリンクを変更するにはどうすればよいですか？

Question

クラスコンテンツにのみ属するリンク（<a>タグ）を修正したいと考えています。

HTMLコード

<div class="content"> 
     <a href="semI">SEM I </a> </br></br> 
     <a href="semII">SEM II </a> 
</div> 

CSSコード

a.content:link, a.content:visited { 
    background-color: #f44336; 
    color: white; 
    width : 400px; 
    padding-left: 25px; 
    text-align: left; 
    text-decoration: none; 
    display: inline-block; 
} 

Answer 1

が.content aまた

.content a:link, .content a:visited { 
     background-color: #f44336; 
     color: white; 
     width : 400px; 
     padding-left: 25px; 
     text-align: left; 
     text-decoration: none; 
     display: inline-block; 
    } 

にあなたのCSSを変更し、brタグがなければなりません保つために

<div class="content"> 
     <a href="semI" class="content">SEM I </a> </br></br> 
     <a href="semII" class="content">SEM II </a> 
</div> 

：ない</br>

.content a:link, 
 
.content a:visited { 
 
    background-color: #f44336; 
 
    color: white; 
 
    width: 400px; 
 
    padding-left: 25px; 
 
    text-align: left; 
 
    text-decoration: none; 
 
    display: inline-block; 
 
}

<div class="content"> 
 
    <a href="semI">SEM I </a> 
 
    <br> 
 
    <br> 
 
    <a href="semII">SEM II </a> 
 
</div>

Answer 2

a.content:link, a.content:visitedがcontentのクラスを持っているすべてのリンクを探している<br>として書かれた、ので、あなたのHTMLがに変更する必要がありますあなたのHTMLは同じです。あなたがCSSを修正してリンクをターゲットにしている場合内のクラスが0の祖先、あなたは行き​​たいです：

.content a:link, .content a:visited { 
    background-color: #f44336; 
    color: white; 
    width : 400px; 
    padding-left: 25px; 
    text-align: left; 
    text-decoration: none; 
    display: inline-block; 
}