SCSS Textdekoration auf Kindelement

Question

Was ist die richtige Syntax zum Anwenden von Textdekoration auf geschachtelt während des Schwebens.

Für das Beispiel lassen sagen, dass wir die HTML-Struktur haben:

<div class="main-wrapper"> 
 
<img src="/abcd.jpg" /> 
 
<a href="http://www.google.com"> Click me! </a> 
 
</div>

Ich möchte anwenden text-decoration

: unterstreichen auf einem (link) Element während schweben Haupt -Wrapper

Vielen Dank

Answer 1

div:hover a { 
    text-decoration: underline; 
} 

Answer 2

Sie SCSS

.main-wrapper{ 
     a { 
     text-decoration: none; 
     } 

     &:hover { 
     a { 
      text-decoration: underline; 
     } 
     } 
    } 

die CSS unter

.main-wrapper:hover a { 
 
    text-decoration: underline; 
 
} 
 

 
.main-wrapper a { 
 
    text-decoration: none; 
 
}

<div class="main-wrapper"> 
 
    <img src="/abcd.jpg" /> 
 
    <a href="http://www.google.com"> Click me! </a> 
 
</div>

erwähnt gibt