бутстрап datetimepicker пользовательский только время только

Question

У меня есть время. Я сгенерировал с помощью javascript bootstrap-datetimepicker.

На следующем рисунке я показал результат:

https://www.dropbox.com/s/iknp2vzty3bykon/time1.jpg?dl=0

, но мне нужно поставить титул timepicker.

На следующем рисунке я показал окончательный результат:

https://www.dropbox.com/s/q0evaqwxmxm3eif/time2.jpg?dl=0

Это мой код:

-Razor код:

<div class="input-group input-append date" id="timepicker1"> 
     @Html.TextBoxFor(model => model.time, new { @class = "form-control datetimepicker" }) 
    <span id="icon" class="input-group-addon add-on"> 
     <span class="icon-time"></span> 
    </span> 
</div> 

-script:

$(function() { 
     $('.datetimepicker').datetimepicker({     
      format: 'HH:mm', 
     });    
    }); 

Я попытался использовать функцию .prepend(), wrap() jquery, но внутри datetimepicker не работает.

Я также доказано, чтобы сделать следующее:

$(function() { 
     $('.datetimepicker').datetimepicker({ 
      format: 'HH:mm', 
      timeText: 'Time', 
      hourText: 'Hour', 
     }); 
    }); 

, но он не работает.

Answer 1

код CSS:

.bootstrap-datetimepicker-widget table td a[data-action="incrementHours"]:before { 
      content: 'Hora'; 
     } 

.bootstrap-datetimepicker-widget table td a[data-action="incrementMinutes"]:before { 
      content: 'Minuts'; 
     } 

.bootstrap-datetimepicker-widget table td a[data-action="incrementHours"]:before, 
.bootstrap-datetimepicker-widget table td a[data-action="incrementMinutes"]:before { 
      display: block; 
      text-align: center; 
      text-transform: uppercase; 
      color: #6a696f; 
      font-weight: bold; 
      font-size: 15px; 
      font-family: 'Segoe UI'; 
      padding-bottom: 10px; 
     } 

.timepicker-picker:before { 
      content: 'Hora'; 
      font-family: 'Segoe UI'; 
      text-transform: uppercase; 
      color: #FFFFFF; 
      background-color: #44bdc5; 
      text-align: center; 
      display: block; 
      padding: 8px 0px; 
      font-weight: bold; 
      font-size: 15px; 
     } 

.bootstrap-datetimepicker-widget .list-unstyled{ 
    margin-top: 0; 
    margin-bottom: 0; 
}