How do I remove the underline from the text of a link?

Question

I know that this question has already been asked here but even using the text-Decoration: None; the underscore continues, at most the text-Decoration: None; removes the color of the text I am using.

The CSS code I’m using for the text in this menu is this one:

 span {color:black; font-size: 30px; font-family: 'Merriweather',
 serif; font-family: 'Fredoka One', cursive; border-radius: 10px;} span
 {background-color:bisque; transition: color 10s;} span:hover
 {background-color: beige;}
span {text-decoration: none;}

Answer 1

As the element that has the underscore is the anchor (<a>), you should apply style to it. Apply style to <span> will have no effect as you will be removing the text-decoration of something that is already text-decoration.

See the example of the CSS in question applied to both tags:

.semSublinhado {
  text-decoration: none;
}

<span class='semSublinhado'><a href='#'>Link com sublinhado</a></span>

<span><a href='#' class='semSublinhado'>Link sem sublinhado</a></span>