添加風格JQuery的TimePicker內DROPDOWNLIST

Question

我使用的是TimePicker庫從以下鏈接Adding a TimePicker to JQuery UI DatePicker

它的正常工作，我在下面加了我的腳本！

HTML

<asp:TextBox ID="text_date" Width="200px" CssClass="textbox my-date" MaxLength="10" runat="server" ClientIDMode="Static"></asp:TextBox> 

JQuery的

$(document).ready(function() { 
    $('#text_date').timepicker({ 
     hourGrid: 0, 
     minuteGrid: 0, 
     stepHour: 1, 
     stepMinute: 5, 
     timeFormat: 'HH:mm', 
     showSecond: false, 
     showMillisec: false, 
     showMicrosec: false, 
     showTimezone: false, 
     controlType: 'select', 
     showButtonPanel: false, 
    }); 
}); 

CSS

.ui-timepicker-div { 
    opacity: 1; 
    background: rgb(244, 193, 157); 
    font-family: 'Berlin Sans FB'; 
    font-size: 17px; 
    width: 100%; 
    height: 100%; 
    border: 2px solid darkblue;  
} 

.ui-timepicker-div .ui-widget-header { 
    margin-bottom: 8px; 
    background: darkorange; 
    color: darkblue; 
    border-bottom: solid 1px #555; 
} 

.ui-timepicker-div dl { 
    text-align: left; 
    width: 90%; 
    margin-left: 3%; 
    margin-right:3%; 
    padding-left: 2%; 
    padding-right: 2%; 
    padding-top: 2%; 
    padding-bottom: 2%; 
    font-family: 'Berlin Sans FB'; 
    font-size: 17px; 
    background: rgb(244, 152, 152); 
    border: 1px solid #9d2323; 
} 
.ui-timepicker-div dl dt { 
    float: left; 
    clear:left; 
    padding: 0 0 0 5px; 
} 

.ui-timepicker-div dl dd { 
    margin: 0 10px 10px 40%; 
} 

.ui-timepicker-div td { 
    font-size: 90%; 
} 
.ui-tpicker-grid-label { 
    background: none; 
    border: none; 
    margin: 0; 
    padding: 0; 
} 

.ui-timepicker-div .ui_tpicker_unit_hide{ 
    display: none; 
} 

.ui-timepicker-div .ui_tpicker_time .ui_tpicker_time_input { 
    background: none; 
    color: inherit; 
    border: none; 
    outline: none; 
    border-bottom: solid 1px #555; 
    width: 95%; 
    font-family: 'Berlin Sans FB'; 
    font-size: 17px; 
} 

.ui-timepicker-div .ui_tpicker_time .ui_tpicker_time_input:focus { 
    border-bottom-color: #aaa; 
} 

這提供了以下OUTP UT，它的工作很好，

但問題是，我不是能夠識別CSS標籤訪問DropDownList的TimePicker內用於選擇的小時和分鐘值。我想添加樣式給他們，但我不知道如何訪問它們。有人可以幫我弄這個嗎？在TimePicker喜歡中提到的CSS沒有顯示訪問DropDownList框的詳細信息。

Answer 1

看看，如果這個工程或不

select.ui-timepicker-select{ 
    background-image: none:!important; 
    background-color: blue; 
} 
select.ui-timepicker-select option{ 
    color: red; 
    background-color: yellow; 
}