Firefox의 선택 상자에서 윤곽선을 제거하는 방법은 무엇입니까?

Firefox의 선택 상자에서 윤곽선 제거

선택 요소에서 선택한 항목을 둘러싼 윤곽선은 시각적으로 방해가 될 수 있습니다. 이 문서에서는 개요 CSS 속성의 비효율성에도 불구하고 Firefox에서 이 개요를 제거하는 방법을 살펴봅니다.

CSS를 사용한 시도 실패

값이 있는 개요 속성 추가 CSS의 none은 Firefox의 윤곽선을 제거하지 않습니다.

select { outline:none; }

의사 클래스를 사용한 방탄 솔루션

더 강력한 솔루션은 Firefox 관련 의사 클래스를 사용하는 것입니다. -class:-moz-focusring:

select:-moz-focusring {
    color: transparent;
    text-shadow: 0 0 0 #000;
}

이 코드는 다음 스타일을:-moz-focusring 가상 클래스에 적용합니다:

• 색상을 투명하게 설정하고 숨깁니다.
• 글꼴 모양의 변경을 방지하기 위해 크기 0의 텍스트 그림자를 추가합니다.

이 스타일을 적용하면 Firefox에서만 점선 윤곽선이 제거되고 영향을 주지 않습니다. 다른 브라우저. 이 솔루션은 선택 상자에서 윤곽선을 제거하기 위한 안정적이고 브라우저별 방법을 제공합니다.

위 내용은 Firefox의 선택 상자에서 윤곽선을 제거하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!