HTML 입력 옵션을 선택하십시오. 크롬에 드롭 다운 화살표가 표시되지 않습니다.

Question

양식을 모달에 포함 시켰습니다. 양식에 선택 입력이 있습니다. 내가 가지고있는 문제는 크롬을 제외한 다른 브라우저에서 선택 드롭 다운 화살표가 표시된다는 것입니다. 그래서 캐럿 아이콘을 추가하고 싶습니다. 이 작업을 수행하는 가장 좋은 방법은 무엇입니까? 대체 솔루션은 또한 환영 당신이 당신의 CSS에서 선택을위한 모양을 제거 할 필요가 전혀

Answer 1

첫째 :

select { 
background: #fff url(myimagepath/image.png) no-repeat 0 90%; 
} 

또는 :

select { 
-webkit-appearance: none; 
-moz-appearance: none; 
appearance: none; 
} 

당신은 이런 일에 자신의 이미지 화살표를 추가 할 수 있습니다 이미지를 사용하고 싶지 않으면 다음과 같이 할 수 있습니다.

select:after { 
    content: ""; 
    position: absolute; 
    z-index: 2; 
    right: 8px; 
    top: 50%; 
    margin-top: -3px; 
    height: 0; 
    width: 0; 
    border-top: 6px solid #f99300; 
    border-left: 6px solid transparent; 
    border-right: 6px solid transparent; 
    pointer-events: none; 
}