프로그래밍/HTML

html : select tag 태그 option 칼라 color 적용방법

재우니 2021. 7. 13. 18:14

 

 

CSS 활용하기

 

option 에 class 를 지정하여 color 를 설정할 수 있다.

.others {
    color:black
}

.othersRed {
    color:red
}

 

<select id="select">
    <option style="color:gray" value="null">select one option</option>
    <option value="1" class="others">one</option>
    <option value="2" class="othersRed">two</option>
</select>

 

jQuery 활용하기

 

또는 jQuery 로 selected 된 값에 따라 color 를 직접 수정이 가능하다.

$(document).ready(function() {
   $('#select').css('color','gray');
   $('#select').change(function() {
      var current = $('#select').val();
      if (current != 'null') {
          $('#select').css('color','black');
      } else {
          $('#select').css('color','gray');
      }
   }); 
});

 

 

발췌

 

https://stackoverflow.com/a/8635403

 

How do change the color of the text of anwithin a