내 드롭다운 배경 이미지가 Chrome에 표시되지 않는 이유는 무엇입니까?

Chrome 드롭다운 배경 이미지 문제

CSS를 사용하여 선택/드롭다운 요소에 배경 이미지를 적용하려고 하면 올바르게 표시되지 않을 수 있습니다. 크롬에서. 이는 해결하기 어려울 수 있는 일반적인 문제입니다.

Firefox 및 Internet Explorer에서 작동하는 다음 CSS 코드는 Chrome에서 배경 이미지를 적용하지 못합니다.

<code class="css">#main .drop-down-loc {
  width: 506px;
  height: 30px;
  border: none;
  background-color: Transparent;
  background: url(images/text-field.gif) no-repeat 0 0;
  padding: 4px;
  line-height: 21px;
}</code>

To Chrome에서 이 문제를 해결하려면 -webkit-appearance 속성을 사용하여 드롭다운의 기본 모양을 제거해야 합니다.

<code class="css">select {
  -webkit-appearance: none;
}</code>

이 CSS 규칙은 Chrome에 기본 드롭다운 모양을 무시하고 사용자 정의 스타일을 적용하도록 지시합니다. 대신.

원하는 경우 배경의 일부로 드롭다운 화살표가 포함된 이미지를 포함할 수도 있습니다. 이를 통해 더욱 매끄러운 외관을 제공하고 사용자 경험을 향상시킬 수 있습니다.

위 내용은 내 드롭다운 배경 이미지가 Chrome에 표시되지 않는 이유는 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!