2016-04-24 78 views
1

我有一个HTML选择窗体有几个选项。选项选择的文本颜色

我想修改文本选项的颜色,但仅限于某些选项。在我下面的小提琴中,我修改了星期二选项的颜色,但修改仅在向下滚动选项时可见。 如何选择星期二的特定颜色,也就是说在选项的顶部?

小提琴:https://jsfiddle.net/bb61c412/280/

代码:

.form-control { 
 
    color: blue; 
 
} 
 

 
.selected { 
 
    color: red; 
 
}
<link rel="stylesheet" type="text/css" href="https://bootswatch.com/bower_components/bootstrap/dist/css/bootstrap.min.css" /> 
 

 
<form action="#" id="form" method="post" data-toggle="validator" style='text-align:center;'> 
 
    <div class="form-inline"> 
 

 
    <select class="form-control" name="date"> 
 
     <option value="0"> 
 
     Date 
 
     </option> 
 
     <option value="1"> 
 
     Monday 
 
     </option> 
 
     <option value="2" selected class="selected"> 
 
     Tuesday 
 
     </option> 
 
     <option value="3"> 
 
     Wednesday 
 
     </option> 
 
     <option value="4"> 
 
     Thursday 
 
     </option> 
 

 
    </select> 
 

 
    </div> 
 

 
</form> 
 

 
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script> 
 
<script type="text/javascript" src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>

+0

的可能的复制[是否有可能与目标选择一个具体选项