2010-12-01 4 views
2

CSS에서 읽기 전용 텍스트 상자의 배경색을 변경하는 방법CSS에서 읽기 전용 텍스트 상자의 배경색을 변경하는 방법

+0

당신이 "읽기 전용 텍스트 상자"가 무엇을 의미합니까 시도 할 수 있습니다? – Emmett

+0

정답을 원한다면 적절한 질문을 게시해야합니다. 현재 코드는 무엇입니까? 변경 사항을 유발하는 요인은 무엇입니까? jQuery와 같은 JS 라이브러리를 사용하고 있습니까? –

답변

7

질문에 너무 많은 알 수없는 부분이 있습니다. 어떤 브라우저를 지원 하시겠습니까? 당신이 텍스트 박스를 말한다면 당신은 ASP.NET을 사용하는 것처럼 보이지만 질문 할 태그는 없습니다.

일반적으로 브라우저간에 동작이 다릅니다.

는 IE8이 제대로 배경색을 렌더링하지만, 장애인 컨트롤이 항상 그림자와 회색 텍스트를해야합니다 다음 HTML을

<html> 
     <head> 
     </head> 
     <body> 
      <input type="text" disabled="disabled" value="This is a test" style="background-color:Black; color:Lime;" /> 
     </body> 
</html> 

을 고려하십시오. 모질 파이어 폭스 (Mozille Firefox)는 컨트롤을 올바르게 렌더링하고 여러 브라우저와 브라우저 버전간에 차이가있을 것이라고 확신합니다 (IE6도 색상 값을 정확하게 해석합니다).

사용하는 브라우저에 관계없이 html을 사용하려면 입력 요소를 사용하는 대신 원하는 테두리와 색상으로 서식을 지정하려면 범위 또는 기타 인라인 요소를 사용해야합니다.

+1

답장을 보내 주셔서 감사합니다. 내가 외부 CSS로 사용할 수있는 가능한 방법은 무엇입니까? – reign

2

당신은

input[disabled="disabled"] { background:url("url-to-background-image.jpg") no-repeat #fff; } 

사용할 수 있으며,이 셀렉터를 지원 나던 오래된 브라우저, 당신은 클래스를

$(document).ready(function() { 
    $("input[disabled="disabled"]").addClass('disabled'); 
}); 

을 적용 할 jQuery를 사용할 수 있습니다 그리고 그것은 모든 시간을 사용할 게 아니라면, 당신은 제공해야 js와 함께 클래스를 제거하기 위해 js를 사용합니다.

+0

이것을 읽기 전용으로 사용할 수 있습니까? – reign

+0

예 그냥 jquery CSS 선택기를 변경하십시오. $ ("input [readonly ="readonly "]") – gdoron

0

이이

input:-moz-read-only { /* For Firefox */ 
    background-color: yellow; 
} 

input:read-only { 
    background-color: yellow; 
} 
관련 문제