마우스 오버시 이름에서 밑줄을 제거하는 방법

그런 HTML이 있습니다.

<legend class="green-color"><a name="section1">Section</a></legend>

legend.green-color{
    color:green;
}

내 경우에는 Section녹색으로 보이지만 마우스 포인터를 올려 놓으면 a href처럼 보였지만 밑줄과 색상 변경없이 그대로 유지하고 싶습니다.

CSS를 변경하지 않고 또는 최소 CSS로 달성 할 수 있습니까?

또는 어떻게 든 jquery와 함께 할 수 있습니까?

이 시도:

legend.green-color a:hover{
    text-decoration: none;
}

앵커 태그의 텍스트 장식 제거

<a name="Section 1" style="text-decoration : none">Section</a>

아래 legend.green-color a:hover에서 CSS를 사용 하여 수행 할 수 있습니다.

legend.green-color a:hover {
    color:green;
    text-decoration:none;
}

색상을 유지하고 링크에서 밑줄을 방지하려면 :

legend.green-color a{
    color:green;
    text-decoration: none;
}

특정 링크에 ID를 할당하고 CSS를 추가 할 수 있습니다. 아래 단계를 참조하십시오.

1. 선택한 ID를 추가합니다 (고유 한 이름이어야하며 숫자가 아닌 텍스트로만 시작할 수 있음) :

<a href="/abc/xyz" id="smallLinkButton">def</a>

2. 그런 다음 필요한 CSS를 다음과 같이 추가합니다.

   #smallLinkButton:hover,active,visited{
   
         text-decoration: none;
         }