2014-07-24 4 views
-3

텍스트 입력 필드에서 데이터를 선택할 때 적용되는 표준 강조 색상은 어떻게 변경합니까? 예를 들어포커스 변경 텍스트 필드의 강조 색상 선택

:

1) 텍스트 필드 상자에 사용자가 클릭. 2.) 내용이 강조 표시됩니다. 3.)이 색상을 변경하고 싶습니다.

<input type="text" value="<?php echo $url;?>" size="40" id="selecturl"/><br/><br/> 

<script language="JavaScript"> 
jQuery(document).ready(function(){ 
    jQuery('#selecturl').focus(); 
    jQuery('#selecturl').select(); 
}); 
</script> 
<style> 
input[type=text]:focus, textarea:focus { 
    box-shadow: 0 0 5px rgba(81, 203, 238, 1); 
    border: 1px solid rgba(81, 203, 238, 1); 
} 
</style> 

감사 :

여기 내 코드입니다! CSS 파일

#input { outline-color: red; } 

에이 줄을 추가하거나 당신은 또한 어떤 ID를 추가하는이 우유없는 작업을 수행 할 수있는 것보다

+1

귀하의 질문이 모호합니다. "회색 강조 색상"이라고 할 때의 의미를 지정하십시오. 텍스트 입력과 같은 UI 요소는 브라우저마다 다를 수 있습니다. 편집 : 또한, 우리가 볼 수있는 CSS가 있습니까? – Jason

답변

0

쉬운 - 참조 데모 : http://jsfiddle.net/Intacto/k8L6u/

<!DOCTYPE html> 
<html> 
    <head> 
    <style type='text/css'> 
    input[type=text]:focus { 
     background-color: lightblue; 
     box-shadow: 0 0 5px indigo; 
     border: 1px solid indigo; 
    } 
    input::selection { background:black; color: white;} 
    input::-moz-selection { background:black; color:white; } 
    input::-webkit-selection { background:black; color:white; } 
    </style> 
</head><body> 

    <input type="text" value="<?php echo $url;?>" size="40" id="selecturl"/><br/><br/> 

    <input type="text" value="URL" size="40" id="selecturl"/><br/><br/> 

</body></html> 
0

봅니다 id="input" 같은 입력에 ID를 추가 할 수 있지만, 페이지에있는 모든 사용자의 입력에 영향을 미칠 것

input { outline-color: red; } 

당신은 jQuery를 사용하여이 작업을 수행하려면 다음

$("#input").css("outline-color","red"); // with id 
$("input").css("outline-color","red"); // witout id 

jsFiddle

0

당신은 CSS3으로 시도 할 수있는 텍스에 대한 강조 표시 색상을 변경합니다.

::selection { background:#B9B9B9; color:#000000; } 
::-moz-selection { background:#B9B9B9; color:#000000; } 
::-webkit-selection { background:#B9B9B9; color:#000000; } 

은 내가 jsfiddle 예를했다 : http://jsfiddle.net/QPLqQ/


참조 : https://stackoverflow.com/a/3482668/3625883

관련 문제