드롭 다운은 HTML 형식에서 RGBA

를 사용하여 검은 색으로 표시, 선택 드롭 다운에는 다음과 같은 CSS :드롭 다운은 HTML 형식에서 RGBA

input[type="text"], textarea, select, option { 
    border:none; 
    padding:5px; 
    font-size:14px; 
    color: #000; 
    background: rgba(0, 0, 0, 0.1); 
}

rgba이 검은 색 10 % 투명도의 대부분에서

" 진짜 "브라우저는 완벽하게 작동하지만 Chrome 및 IE9에서는 작동하지 않습니다.

간단한 질문,이를 수정하기 위해 어떤 규칙을 추가해야합니까?

여기는 Fiddle입니다.

나는 "좋은 질문"과 피들을 얻었지만 이제는 어느 누구도 해결책을 얻을 수 있습니까? 나는 정말 HTML 세계에서 SELECT 드롭 다운 스타일 하나입니까? 나는 그렇지 않다! :-)

출처

2013-03-19 menardmam

+1 좋은 질문입니다! –

기본 양식 요소의 스타일을 지정하려고하면 시간이 많이 걸릴 것입니다. 그냥 말해. –

SELECT는 신뢰할 수있는 스타일의 브라우저가 아니며 실제로 의도 된 것도 아닙니다. HTML 요소가 아니라 운영 체제에 의존적 인 위젯입니다. 참조 : http://www.slideshare.net/jdmedina17/the-html-ltselect-tag –

그냥 다음과 같이하십시오 :

CSS 부 :

솔루션 # 1 :

input[type="text"], textarea, select, option { 
    border:none; 
    padding:5px; 
    font-size:14px; 
    color: rgb(0, 0, 0); 
    background: rgba(0, 0, 0, 0.1); 
    /* Theoretically for IE 8 & 9 (more valid) */ 
    /* ...but not required as filter works too */ 
    /* should come BEFORE filter */ 
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=50)"; 
    /* This works in IE 8 & 9 too */ 
    /* ... but also 5, 6, 7 */ 
    filter: alpha(opacity=50); 
    /* Older than Firefox 0.9 */ 
    -moz-opacity:0.5; 
    /* Safari 1.x (pre WebKit!) */ 
    -khtml-opacity: 0.5; 
    /* Modern! 
    /* Firefox 0.9+, Safari 2?, Chrome any? 
    /* Opera 9+, IE 9+ */ 
    opacity: 0.5; 
}

솔루션 # 2 :

,363,210

input[type="text"], textarea, select, option { 
    border:none; 
    padding:5px; 
    font-size:14px; 
    color: #000000; 
    background: rgba(0, 0, 0, 0.1);  
} 
select 
{ 
    -webkit-appearance: none; 
} 

This second solution will work perfectly, except the dropdown arrow, we need to set the dropdown arrow image via background url css. because chrome where defaultly applying the **User Agent Stylesheet** for Select Dropdown Elements.

다음 위치를 참조하십시오 :

(1). What is user agent stylesheet ?

(2). CSS2.1 User Agent Style Sheet Defaults ?

(3). User Agent Style Sheets: Basics and Samples ?

HTML 부분 :

<select> 
    <option value="1">Option 1</option> 
    <option value="2">Option 2</option> 
    <option value="3">Option 3</option> 
    <option value="4">Option 4</option> 
</select>

나는 이것이 당신이 당신의 문제를 해결하는 데 도움이 될 수 있습니다 생각합니다.

출처

2013-03-20 05:08:16

드롭 다운은 HTML 형식에서 RGBA

답변

관련 문제