>웹 프론트엔드 >CSS 튜토리얼 >다른 브라우저에서 파일 입력 필드에 대한 커서를 어떻게 사용자 정의할 수 있습니까?

다른 브라우저에서 파일 입력 필드에 대한 커서를 어떻게 사용자 정의할 수 있습니까?

Patricia Arquette
Patricia Arquette원래의
2024-11-22 10:06:11527검색

How Can I Customize the Cursor for File Input Fields in Different Browsers?

파일 입력 유형에 대한 커서 사용자 정의

파일 입력에 대한 커서 유형을 수정하는 것은 번거로울 수 있습니다. 예제 코드에서 강조된 것처럼 표준 CSS 접근 방식은 작동하지 않습니다.

input[type="file"] {
  cursor: pointer;
}

다행히도 ::webkit-file-upload-button 의사 클래스를 활용하는 Chrome 브라우저용 부분 솔루션이 있습니다.

input[type=file], /* FF, IE7+, chrome (except button) */
input[type=file]::-webkit-file-upload-button { /* chromes and blink button */
    cursor: pointer; 
}

이 기술을 사용하면 파일 입력의 원래 모양을 유지하면서 커서를 사용자 정의 유형으로 설정할 수 있습니다. 이 솔루션은 Chrome 및 Blink 엔진 기반 브라우저에서만 작동합니다. Firefox와 Safari는 현재 서로 다른 동작을 보입니다.

위 내용은 다른 브라우저에서 파일 입력 필드에 대한 커서를 어떻게 사용자 정의할 수 있습니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.